@firestitch/app-message 18.0.18 → 18.0.19

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.
@@ -257,7 +257,7 @@ class MessageComponent {
257
257
  });
258
258
  }
259
259
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: MessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
260
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.7", type: MessageComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"message\"\n [confirmTabs]=\"false\">\n @if (message) {\n <fs-dialog>\n <div mat-dialog-title>\n Edit Message\n </div>\n <mat-dialog-content>\n <mat-tab-group\n fsTabs\n [(selected)]=\"tab\">\n <mat-tab\n label=\"General\"\n name=\"general\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <mat-form-field>\n <mat-label>\n Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.name\"\n name=\"Name\"\n required>\n </mat-form-field>\n <fs-label-field>\n <fs-label>\n Reference\n </fs-label>\n {{ message.reference }}\n </fs-label-field>\n <mat-form-field>\n <mat-label>\n Description\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.description\"\n name=\"description\">\n </mat-form-field>\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n From Email\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromEmail\"\n name=\"from_email\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n From Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromName\"\n name=\"from_name\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Reply To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.replyEmail\"\n name=\"reply_to\">\n </mat-form-field>\n </div>\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.toRecipients\"\n name=\"to\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n CC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.ccRecipients\"\n name=\"cc\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n BCC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.bccRecipients\"\n name=\"bcc\">\n </mat-form-field>\n </div>\n </div>\n </ng-template>\n </mat-tab>\n @if (message.emailMessage) {\n <mat-tab\n label=\"Email Message\"\n name=\"email\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <div class=\"fs-row.gap-sm\">\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.customize\"\n name=\"customizeEmail\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Format\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.format\"\n name=\"format\">\n @for (item of emailMessageFormats; track item) {\n <mat-option\n [value]=\"item.value\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Template\n </mat-label>\n <mat-select\n [(ngModel)]=\"message.emailMessage.messageTemplateId\"\n name=\"template\">\n <mat-option [value]=\"null\">\n None\n </mat-option>\n @for (item of messageTemplates; track item) {\n <mat-option\n [value]=\"item.id\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n @if (message.emailMessage.customize) {\n <mat-form-field>\n <mat-label>\n Subject\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.subject\"\n name=\"name\"\n required>\n </mat-form-field>\n <div [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n @if (message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\"\n [config]=\"{ language: 'html '}\">\n </fs-text-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.RichText) {\n <fs-html-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\">\n </fs-html-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"emailMessageBody\"\n [config]=\"{ language: 'text' }\">\n </fs-text-editor>\n }\n </ng-template>\n </mat-tab>\n @if (message.emailMessage.format===emailMessageFormat.HTML || message.emailMessage.format===emailMessageFormat.RichText) {\n <mat-tab\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 }\n </mat-tab-group>\n </div>\n }\n @if (!message.emailMessage.customize) {\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n {{ message.defaultEmailSubject }}\n </fs-label-field>\n <div>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"email-body-html-default\">\n @if (message.emailMessage.format===emailMessageFormat.RichText || message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-html-renderer\n [html]=\"message.defaultEmailBody\">\n </fs-html-renderer>\n }\n </div>\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <div\n class=\"email-body-text-default\"\n >\n {{ message.defaultEmailBody }}\n </div>\n }\n </fs-label-field>\n </div>\n }\n </div>\n </ng-template>\n </mat-tab>\n }\n @if (!!message.smsMessage) {\n <mat-tab\n label=\"SMS Message\"\n name=\"sms\">\n <ng-template matTabContent>\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.smsMessage.customize\"\n name=\"customizeSms\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n @if (message.smsMessage.customize) {\n <div\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 }\n @if (!message.smsMessage.customize) {\n <fs-label-field>\n <fs-label>\n Message\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n }\n @if (message.emailMessage) {\n <mat-tab\n label=\"Attachments\"\n name=\"attachments\">\n <ng-template matTabContent>\n <fs-app-message-attachments [message]=\"message\"></fs-app-message-attachments>\n </ng-template>\n </mat-tab>\n }\n @if (message.variables) {\n <mat-tab\n label=\"Variables\"\n >\n <ng-template matTabContent>\n @for (variable of message.variables; track variable) {\n <div\n class=\"variable\">\n {{ variable.name }}\n </div>\n }\n </ng-template>\n </mat-tab>\n }\n <mat-tab label=\"Defaults\">\n <ng-template matTabContent>\n @if (message.emailMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n Email\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailSubject }}\n </div>\n </fs-label-field>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailBody }}\n </div>\n </fs-label-field>\n }\n @if (message.smsMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n SMS\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </mat-dialog-content>\n <mat-dialog-actions>\n @if (tab==='email' || tab==='sms' || tab==='general') {\n <button\n mat-button\n color=\"primary\">\n Save\n </button>\n @if (tab==='email') {\n <button\n mat-button\n type=\"button\"\n (click)=\"openPreview()\"\n type=\"button\">\n Preview\n </button>\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('email')\"\n type=\"button\">\n Send Test Email\n </button>\n }\n @if (tab==='sms') {\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('sms')\"\n type=\"button\">\n Send Test SMS\n </button>\n }\n <button\n mat-button\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Cancel\n </button>\n } @else {\n <button\n mat-button\n color=\"primary\"\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Close\n </button>\n }\n </mat-dialog-actions>\n </fs-dialog>\n }\n</form>", 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{white-space:pre-line}.fs-column .mat-form-field{flex:1}.email-body-text{width:100%}.variable{margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: FsSkeletonModule }, { kind: "directive", type: i1$1.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FsFormModule }, { kind: "directive", type: i3.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup", "deactivationGuard"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"], exportAs: ["fsForm"] }, { kind: "directive", type: i3.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { kind: "directive", type: i3.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: i3.FsButtonDirective, selector: "[mat-raised-button]:not([fsFormButtonStandalone]),[mat-button]:not([fsFormButtonStandalone]),[mat-flat-button]:not([fsFormButtonStandalone]),[mat-stroked-button]:not([fsFormButtonStandalone])", inputs: ["name", "dirtySubmit", "form"] }, { kind: "ngmodule", type: FsDialogModule }, { kind: "component", type: i2.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileButtonPlacement", "mobileWidth", "mode", "buttonLayout"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: FsTabsModule }, { kind: "directive", type: i5.FsTabsHeaderTabGroupDirective, selector: "mat-tab-group, matTabGroup, [matTabGroup]", inputs: ["orientation", "selected", "selectedData"], outputs: ["selectedChange", "selectedDataChange"], exportAs: ["fsTabsHeaderTabGroup"] }, { kind: "directive", type: i5.FsTabsTabDirective, selector: "mat-tab,matTab", inputs: ["name", "data"], exportAs: ["fsTabsTab"] }, { kind: "component", type: MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "directive", type: MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FsLabelModule }, { kind: "component", type: i6.FsLabelComponent, selector: "fs-label" }, { kind: "component", type: i6.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["appearance", "showOutline", "disabled", "focused", "hoverable", "padless"] }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FsTextEditorModule }, { kind: "component", type: i7.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["ready", "blur"] }, { kind: "ngmodule", type: FsHtmlEditorModule }, { kind: "component", type: i8.FsHtmlEditorComponent, selector: "fs-html-editor", inputs: ["config", "disabled"] }, { kind: "ngmodule", type: FsHtmlRendererModule }, { kind: "component", type: i8.FsHtmlRendererComponent, selector: "fs-html-renderer", inputs: ["html"] }, { kind: "component", type: AttachmentsComponent, selector: "fs-app-message-attachments", inputs: ["message"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
260
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.7", type: MessageComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"message\"\n [confirmTabs]=\"false\">\n @if (message) {\n <fs-dialog>\n <div mat-dialog-title>\n Edit Message\n </div>\n <mat-dialog-content>\n <mat-tab-group\n fsTabs\n [(selected)]=\"tab\">\n <mat-tab\n label=\"General\"\n name=\"general\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <mat-form-field>\n <mat-label>\n Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.name\"\n name=\"Name\"\n required>\n </mat-form-field>\n <fs-label-field>\n <fs-label>\n Reference\n </fs-label>\n {{ message.reference }}\n </fs-label-field>\n <mat-form-field>\n <mat-label>\n Description\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.description\"\n name=\"description\">\n </mat-form-field>\n @if (message.emailMessage) {\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n From Email\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromEmail\"\n name=\"from_email\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n From Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromName\"\n name=\"from_name\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Reply To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.replyEmail\"\n name=\"reply_to\">\n </mat-form-field>\n </div>\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.toRecipients\"\n name=\"to\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n CC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.ccRecipients\"\n name=\"cc\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n BCC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.bccRecipients\"\n name=\"bcc\">\n </mat-form-field>\n </div>\n }\n </div>\n </ng-template>\n </mat-tab>\n @if (message.emailMessage) {\n <mat-tab\n label=\"Email Message\"\n name=\"email\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <div class=\"fs-row.gap-sm\">\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.customize\"\n name=\"customizeEmail\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Format\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.format\"\n name=\"format\">\n @for (item of emailMessageFormats; track item) {\n <mat-option\n [value]=\"item.value\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Template\n </mat-label>\n <mat-select\n [(ngModel)]=\"message.emailMessage.messageTemplateId\"\n name=\"template\">\n <mat-option [value]=\"null\">\n None\n </mat-option>\n @for (item of messageTemplates; track item) {\n <mat-option\n [value]=\"item.id\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n @if (message.emailMessage.customize) {\n <mat-form-field>\n <mat-label>\n Subject\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.subject\"\n name=\"name\"\n required>\n </mat-form-field>\n <div [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n @if (message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\"\n [config]=\"{ language: 'html '}\">\n </fs-text-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.RichText) {\n <fs-html-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\">\n </fs-html-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"emailMessageBody\"\n [config]=\"{ language: 'text' }\">\n </fs-text-editor>\n }\n </ng-template>\n </mat-tab>\n @if (message.emailMessage.format===emailMessageFormat.HTML || message.emailMessage.format===emailMessageFormat.RichText) {\n <mat-tab\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 }\n </mat-tab-group>\n </div>\n }\n @if (!message.emailMessage.customize) {\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n {{ message.defaultEmailSubject }}\n </fs-label-field>\n <div>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"email-body-html-default\">\n @if (message.emailMessage.format===emailMessageFormat.RichText || message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-html-renderer\n [html]=\"message.defaultEmailBody\">\n </fs-html-renderer>\n }\n </div>\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <div\n class=\"email-body-text-default\"\n >\n {{ message.defaultEmailBody }}\n </div>\n }\n </fs-label-field>\n </div>\n }\n </div>\n </ng-template>\n </mat-tab>\n }\n @if (!!message.smsMessage) {\n <mat-tab\n label=\"SMS Message\"\n name=\"sms\">\n <ng-template matTabContent>\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.smsMessage.customize\"\n name=\"customizeSms\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n @if (message.smsMessage.customize) {\n <div\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 }\n @if (!message.smsMessage.customize) {\n <fs-label-field>\n <fs-label>\n Message\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n }\n @if (message.emailMessage) {\n <mat-tab\n label=\"Attachments\"\n name=\"attachments\">\n <ng-template matTabContent>\n <fs-app-message-attachments [message]=\"message\"></fs-app-message-attachments>\n </ng-template>\n </mat-tab>\n }\n @if (message.variables) {\n <mat-tab\n label=\"Variables\"\n >\n <ng-template matTabContent>\n @for (variable of message.variables; track variable) {\n <div\n class=\"variable\">\n {{ variable.name }}\n </div>\n }\n </ng-template>\n </mat-tab>\n }\n <mat-tab label=\"Defaults\">\n <ng-template matTabContent>\n @if (message.emailMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n Email\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailSubject }}\n </div>\n </fs-label-field>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailBody }}\n </div>\n </fs-label-field>\n }\n @if (message.smsMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n SMS\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </mat-dialog-content>\n <mat-dialog-actions>\n @if (tab==='email' || tab==='sms' || tab==='general') {\n <button\n mat-button\n color=\"primary\">\n Save\n </button>\n @if (tab==='email') {\n <button\n mat-button\n type=\"button\"\n (click)=\"openPreview()\"\n type=\"button\">\n Preview\n </button>\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('email')\"\n type=\"button\">\n Send Test Email\n </button>\n }\n @if (tab==='sms') {\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('sms')\"\n type=\"button\">\n Send Test SMS\n </button>\n }\n <button\n mat-button\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Cancel\n </button>\n } @else {\n <button\n mat-button\n color=\"primary\"\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Close\n </button>\n }\n </mat-dialog-actions>\n </fs-dialog>\n }\n</form>", 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{white-space:pre-line}.fs-column .mat-form-field{flex:1}.email-body-text{width:100%}.variable{margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: FsSkeletonModule }, { kind: "directive", type: i1$1.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FsFormModule }, { kind: "directive", type: i3.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup", "deactivationGuard"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"], exportAs: ["fsForm"] }, { kind: "directive", type: i3.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { kind: "directive", type: i3.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: i3.FsButtonDirective, selector: "[mat-raised-button]:not([fsFormButtonStandalone]),[mat-button]:not([fsFormButtonStandalone]),[mat-flat-button]:not([fsFormButtonStandalone]),[mat-stroked-button]:not([fsFormButtonStandalone])", inputs: ["name", "dirtySubmit", "form"] }, { kind: "ngmodule", type: FsDialogModule }, { kind: "component", type: i2.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileButtonPlacement", "mobileWidth", "mode", "buttonLayout"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: FsTabsModule }, { kind: "directive", type: i5.FsTabsHeaderTabGroupDirective, selector: "mat-tab-group, matTabGroup, [matTabGroup]", inputs: ["orientation", "selected", "selectedData"], outputs: ["selectedChange", "selectedDataChange"], exportAs: ["fsTabsHeaderTabGroup"] }, { kind: "directive", type: i5.FsTabsTabDirective, selector: "mat-tab,matTab", inputs: ["name", "data"], exportAs: ["fsTabsTab"] }, { kind: "component", type: MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "directive", type: MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FsLabelModule }, { kind: "component", type: i6.FsLabelComponent, selector: "fs-label" }, { kind: "component", type: i6.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["appearance", "showOutline", "disabled", "focused", "hoverable", "padless"] }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FsTextEditorModule }, { kind: "component", type: i7.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["ready", "blur"] }, { kind: "ngmodule", type: FsHtmlEditorModule }, { kind: "component", type: i8.FsHtmlEditorComponent, selector: "fs-html-editor", inputs: ["config", "disabled"] }, { kind: "ngmodule", type: FsHtmlRendererModule }, { kind: "component", type: i8.FsHtmlRendererComponent, selector: "fs-html-renderer", inputs: ["html"] }, { kind: "component", type: AttachmentsComponent, selector: "fs-app-message-attachments", inputs: ["message"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
261
261
  }
262
262
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: MessageComponent, decorators: [{
263
263
  type: Component,
@@ -286,7 +286,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.7", ngImpor
286
286
  MatDialogActions,
287
287
  MatButton,
288
288
  MatDialogClose,
289
- ], template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"message\"\n [confirmTabs]=\"false\">\n @if (message) {\n <fs-dialog>\n <div mat-dialog-title>\n Edit Message\n </div>\n <mat-dialog-content>\n <mat-tab-group\n fsTabs\n [(selected)]=\"tab\">\n <mat-tab\n label=\"General\"\n name=\"general\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <mat-form-field>\n <mat-label>\n Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.name\"\n name=\"Name\"\n required>\n </mat-form-field>\n <fs-label-field>\n <fs-label>\n Reference\n </fs-label>\n {{ message.reference }}\n </fs-label-field>\n <mat-form-field>\n <mat-label>\n Description\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.description\"\n name=\"description\">\n </mat-form-field>\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n From Email\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromEmail\"\n name=\"from_email\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n From Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromName\"\n name=\"from_name\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Reply To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.replyEmail\"\n name=\"reply_to\">\n </mat-form-field>\n </div>\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.toRecipients\"\n name=\"to\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n CC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.ccRecipients\"\n name=\"cc\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n BCC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.bccRecipients\"\n name=\"bcc\">\n </mat-form-field>\n </div>\n </div>\n </ng-template>\n </mat-tab>\n @if (message.emailMessage) {\n <mat-tab\n label=\"Email Message\"\n name=\"email\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <div class=\"fs-row.gap-sm\">\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.customize\"\n name=\"customizeEmail\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Format\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.format\"\n name=\"format\">\n @for (item of emailMessageFormats; track item) {\n <mat-option\n [value]=\"item.value\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Template\n </mat-label>\n <mat-select\n [(ngModel)]=\"message.emailMessage.messageTemplateId\"\n name=\"template\">\n <mat-option [value]=\"null\">\n None\n </mat-option>\n @for (item of messageTemplates; track item) {\n <mat-option\n [value]=\"item.id\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n @if (message.emailMessage.customize) {\n <mat-form-field>\n <mat-label>\n Subject\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.subject\"\n name=\"name\"\n required>\n </mat-form-field>\n <div [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n @if (message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\"\n [config]=\"{ language: 'html '}\">\n </fs-text-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.RichText) {\n <fs-html-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\">\n </fs-html-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"emailMessageBody\"\n [config]=\"{ language: 'text' }\">\n </fs-text-editor>\n }\n </ng-template>\n </mat-tab>\n @if (message.emailMessage.format===emailMessageFormat.HTML || message.emailMessage.format===emailMessageFormat.RichText) {\n <mat-tab\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 }\n </mat-tab-group>\n </div>\n }\n @if (!message.emailMessage.customize) {\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n {{ message.defaultEmailSubject }}\n </fs-label-field>\n <div>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"email-body-html-default\">\n @if (message.emailMessage.format===emailMessageFormat.RichText || message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-html-renderer\n [html]=\"message.defaultEmailBody\">\n </fs-html-renderer>\n }\n </div>\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <div\n class=\"email-body-text-default\"\n >\n {{ message.defaultEmailBody }}\n </div>\n }\n </fs-label-field>\n </div>\n }\n </div>\n </ng-template>\n </mat-tab>\n }\n @if (!!message.smsMessage) {\n <mat-tab\n label=\"SMS Message\"\n name=\"sms\">\n <ng-template matTabContent>\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.smsMessage.customize\"\n name=\"customizeSms\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n @if (message.smsMessage.customize) {\n <div\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 }\n @if (!message.smsMessage.customize) {\n <fs-label-field>\n <fs-label>\n Message\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n }\n @if (message.emailMessage) {\n <mat-tab\n label=\"Attachments\"\n name=\"attachments\">\n <ng-template matTabContent>\n <fs-app-message-attachments [message]=\"message\"></fs-app-message-attachments>\n </ng-template>\n </mat-tab>\n }\n @if (message.variables) {\n <mat-tab\n label=\"Variables\"\n >\n <ng-template matTabContent>\n @for (variable of message.variables; track variable) {\n <div\n class=\"variable\">\n {{ variable.name }}\n </div>\n }\n </ng-template>\n </mat-tab>\n }\n <mat-tab label=\"Defaults\">\n <ng-template matTabContent>\n @if (message.emailMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n Email\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailSubject }}\n </div>\n </fs-label-field>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailBody }}\n </div>\n </fs-label-field>\n }\n @if (message.smsMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n SMS\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </mat-dialog-content>\n <mat-dialog-actions>\n @if (tab==='email' || tab==='sms' || tab==='general') {\n <button\n mat-button\n color=\"primary\">\n Save\n </button>\n @if (tab==='email') {\n <button\n mat-button\n type=\"button\"\n (click)=\"openPreview()\"\n type=\"button\">\n Preview\n </button>\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('email')\"\n type=\"button\">\n Send Test Email\n </button>\n }\n @if (tab==='sms') {\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('sms')\"\n type=\"button\">\n Send Test SMS\n </button>\n }\n <button\n mat-button\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Cancel\n </button>\n } @else {\n <button\n mat-button\n color=\"primary\"\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Close\n </button>\n }\n </mat-dialog-actions>\n </fs-dialog>\n }\n</form>", 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{white-space:pre-line}.fs-column .mat-form-field{flex:1}.email-body-text{width:100%}.variable{margin-bottom:4px}\n"] }]
289
+ ], template: "<form\n fsForm\n [submit]=\"save\"\n #form=\"ngForm\"\n *fsSkeleton=\"message\"\n [confirmTabs]=\"false\">\n @if (message) {\n <fs-dialog>\n <div mat-dialog-title>\n Edit Message\n </div>\n <mat-dialog-content>\n <mat-tab-group\n fsTabs\n [(selected)]=\"tab\">\n <mat-tab\n label=\"General\"\n name=\"general\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <mat-form-field>\n <mat-label>\n Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.name\"\n name=\"Name\"\n required>\n </mat-form-field>\n <fs-label-field>\n <fs-label>\n Reference\n </fs-label>\n {{ message.reference }}\n </fs-label-field>\n <mat-form-field>\n <mat-label>\n Description\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.description\"\n name=\"description\">\n </mat-form-field>\n @if (message.emailMessage) {\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n From Email\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromEmail\"\n name=\"from_email\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n From Name\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.fromName\"\n name=\"from_name\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Reply To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.replyEmail\"\n name=\"reply_to\">\n </mat-form-field>\n </div>\n <div class=\"fs-row.gap-sm.wrap\">\n <mat-form-field>\n <mat-label>\n To\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.toRecipients\"\n name=\"to\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n CC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.ccRecipients\"\n name=\"cc\">\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n BCC\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.bccRecipients\"\n name=\"bcc\">\n </mat-form-field>\n </div>\n }\n </div>\n </ng-template>\n </mat-tab>\n @if (message.emailMessage) {\n <mat-tab\n label=\"Email Message\"\n name=\"email\">\n <ng-template matTabContent>\n <div class=\"fs-column\">\n <div class=\"fs-row.gap-sm\">\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.customize\"\n name=\"customizeEmail\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Format\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.emailMessage.format\"\n name=\"format\">\n @for (item of emailMessageFormats; track item) {\n <mat-option\n [value]=\"item.value\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label>\n Template\n </mat-label>\n <mat-select\n [(ngModel)]=\"message.emailMessage.messageTemplateId\"\n name=\"template\">\n <mat-option [value]=\"null\">\n None\n </mat-option>\n @for (item of messageTemplates; track item) {\n <mat-option\n [value]=\"item.id\">\n {{ item.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n @if (message.emailMessage.customize) {\n <mat-form-field>\n <mat-label>\n Subject\n </mat-label>\n <input\n matInput\n [(ngModel)]=\"message.emailMessage.subject\"\n name=\"name\"\n required>\n </mat-form-field>\n <div [@.disabled]=\"true\">\n <mat-tab-group [dynamicHeight]=\"false\">\n <mat-tab label=\"Content\">\n <ng-template matTabContent>\n @if (message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\"\n [config]=\"{ language: 'html '}\">\n </fs-text-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.RichText) {\n <fs-html-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"body\">\n </fs-html-editor>\n }\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <fs-text-editor\n [(ngModel)]=\"message.emailMessage.body\"\n name=\"emailMessageBody\"\n [config]=\"{ language: 'text' }\">\n </fs-text-editor>\n }\n </ng-template>\n </mat-tab>\n @if (message.emailMessage.format===emailMessageFormat.HTML || message.emailMessage.format===emailMessageFormat.RichText) {\n <mat-tab\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 }\n </mat-tab-group>\n </div>\n }\n @if (!message.emailMessage.customize) {\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n {{ message.defaultEmailSubject }}\n </fs-label-field>\n <div>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"email-body-html-default\">\n @if (message.emailMessage.format===emailMessageFormat.RichText || message.emailMessage.format===emailMessageFormat.HTML) {\n <fs-html-renderer\n [html]=\"message.defaultEmailBody\">\n </fs-html-renderer>\n }\n </div>\n @if (message.emailMessage.format===emailMessageFormat.Text) {\n <div\n class=\"email-body-text-default\"\n >\n {{ message.defaultEmailBody }}\n </div>\n }\n </fs-label-field>\n </div>\n }\n </div>\n </ng-template>\n </mat-tab>\n }\n @if (!!message.smsMessage) {\n <mat-tab\n label=\"SMS Message\"\n name=\"sms\">\n <ng-template matTabContent>\n <mat-form-field>\n <mat-label>\n Customize Message\n </mat-label>\n <mat-select\n required\n [(ngModel)]=\"message.smsMessage.customize\"\n name=\"customizeSms\">\n <mat-option [value]=\"true\">\n Yes\n </mat-option>\n <mat-option [value]=\"false\">\n No\n </mat-option>\n </mat-select>\n </mat-form-field>\n @if (message.smsMessage.customize) {\n <div\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 }\n @if (!message.smsMessage.customize) {\n <fs-label-field>\n <fs-label>\n Message\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n }\n @if (message.emailMessage) {\n <mat-tab\n label=\"Attachments\"\n name=\"attachments\">\n <ng-template matTabContent>\n <fs-app-message-attachments [message]=\"message\"></fs-app-message-attachments>\n </ng-template>\n </mat-tab>\n }\n @if (message.variables) {\n <mat-tab\n label=\"Variables\"\n >\n <ng-template matTabContent>\n @for (variable of message.variables; track variable) {\n <div\n class=\"variable\">\n {{ variable.name }}\n </div>\n }\n </ng-template>\n </mat-tab>\n }\n <mat-tab label=\"Defaults\">\n <ng-template matTabContent>\n @if (message.emailMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n Email\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Subject\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailSubject }}\n </div>\n </fs-label-field>\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultEmailBody }}\n </div>\n </fs-label-field>\n }\n @if (message.smsMessage) {\n @if (message.emailMessage && message.smsMessage) {\n <h2>\n SMS\n </h2>\n }\n <fs-label-field>\n <fs-label>\n Content\n </fs-label>\n <div class=\"content\">\n {{ message.defaultSmsMessage }}\n </div>\n </fs-label-field>\n }\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </mat-dialog-content>\n <mat-dialog-actions>\n @if (tab==='email' || tab==='sms' || tab==='general') {\n <button\n mat-button\n color=\"primary\">\n Save\n </button>\n @if (tab==='email') {\n <button\n mat-button\n type=\"button\"\n (click)=\"openPreview()\"\n type=\"button\">\n Preview\n </button>\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('email')\"\n type=\"button\">\n Send Test Email\n </button>\n }\n @if (tab==='sms') {\n <button\n mat-button\n type=\"button\"\n (click)=\"sendTest('sms')\"\n type=\"button\">\n Send Test SMS\n </button>\n }\n <button\n mat-button\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Cancel\n </button>\n } @else {\n <button\n mat-button\n color=\"primary\"\n [mat-dialog-close]=\"null\"\n type=\"button\">\n Close\n </button>\n }\n </mat-dialog-actions>\n </fs-dialog>\n }\n</form>", 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{white-space:pre-line}.fs-column .mat-form-field{flex:1}.email-body-text{width:100%}.variable{margin-bottom:4px}\n"] }]
290
290
  }] });
291
291
 
292
292
  class MessagesComponent {
@@ -332,11 +332,11 @@ class MessagesComponent {
332
332
  this._destroy$.complete();
333
333
  }
334
334
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: MessagesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
335
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.7", type: MessagesComponent, isStandalone: true, 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\n title=\"Name\"\n name=\"name\"\n [sortable]=\"true\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <a (click)=\"open(row)\">\n {{ row.name }}\n </a>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email format\">\n <ng-template\n fs-list-cell\n 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\n fs-list-cell\n let-row=\"row\">\n {{ row.emailMessage.messageTemplate?.name || 'None' }}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Channels\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <div class=\"fs-delimit\">\n @if (row.emailMessage) {\n <span>\n Email\n </span>\n }\n @if (row.smsMessage) {\n <span>\n SMS\n </span>\n }\n </div>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Customized message\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage?.customize || row.smsMessage?.customize) {\n @if (row.emailMessage?.customize) {\n {{ row.emailMessage.customize ? 'Email' : '' }}\n }\n @if (row.smsMessage?.customize) {\n {{ row.smsMessage.customize ? 'SMS' : '' }}\n }\n } @else {\n None\n }\n </ng-template>\n </fs-list-column>\n</fs-list>", dependencies: [{ kind: "ngmodule", type: FsListModule }, { kind: "component", type: i1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { kind: "directive", type: i1.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customizable", "sortable", "sortableDefault", "sortableDirection", "direction", "align", "width", "class"] }, { kind: "directive", type: i1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }] });
335
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.7", type: MessagesComponent, isStandalone: true, 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\n title=\"Name\"\n name=\"name\"\n [sortable]=\"true\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <a (click)=\"open(row)\">\n {{ row.name }}\n </a>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email format\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage) {\n {{ emailMessageFormats[row.emailMessage.format] }}\n }\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email message template\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage) {\n {{ row.emailMessage.messageTemplate?.name || 'None' }}\n }\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Channels\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <div class=\"fs-delimit\">\n @if (row.emailMessage) {\n <span>\n Email\n </span>\n }\n @if (row.smsMessage) {\n <span>\n SMS\n </span>\n }\n </div>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Customized message\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage?.customize || row.smsMessage?.customize) {\n @if (row.emailMessage?.customize) {\n {{ row.emailMessage.customize ? 'Email' : '' }}\n }\n @if (row.smsMessage?.customize) {\n {{ row.smsMessage.customize ? 'SMS' : '' }}\n }\n } @else {\n None\n }\n </ng-template>\n </fs-list-column>\n</fs-list>", dependencies: [{ kind: "ngmodule", type: FsListModule }, { kind: "component", type: i1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { kind: "directive", type: i1.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customizable", "sortable", "sortableDefault", "sortableDirection", "direction", "align", "width", "class"] }, { kind: "directive", type: i1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }] });
336
336
  }
337
337
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: MessagesComponent, decorators: [{
338
338
  type: Component,
339
- args: [{ selector: 'fs-app-messages', standalone: true, imports: [FsListModule], template: "<fs-list [config]=\"config\">\n <fs-list-column\n title=\"Name\"\n name=\"name\"\n [sortable]=\"true\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <a (click)=\"open(row)\">\n {{ row.name }}\n </a>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email format\">\n <ng-template\n fs-list-cell\n 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\n fs-list-cell\n let-row=\"row\">\n {{ row.emailMessage.messageTemplate?.name || 'None' }}\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Channels\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <div class=\"fs-delimit\">\n @if (row.emailMessage) {\n <span>\n Email\n </span>\n }\n @if (row.smsMessage) {\n <span>\n SMS\n </span>\n }\n </div>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Customized message\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage?.customize || row.smsMessage?.customize) {\n @if (row.emailMessage?.customize) {\n {{ row.emailMessage.customize ? 'Email' : '' }}\n }\n @if (row.smsMessage?.customize) {\n {{ row.smsMessage.customize ? 'SMS' : '' }}\n }\n } @else {\n None\n }\n </ng-template>\n </fs-list-column>\n</fs-list>" }]
339
+ args: [{ selector: 'fs-app-messages', standalone: true, imports: [FsListModule], template: "<fs-list [config]=\"config\">\n <fs-list-column\n title=\"Name\"\n name=\"name\"\n [sortable]=\"true\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <a (click)=\"open(row)\">\n {{ row.name }}\n </a>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email format\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage) {\n {{ emailMessageFormats[row.emailMessage.format] }}\n }\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Email message template\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage) {\n {{ row.emailMessage.messageTemplate?.name || 'None' }}\n }\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Channels\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n <div class=\"fs-delimit\">\n @if (row.emailMessage) {\n <span>\n Email\n </span>\n }\n @if (row.smsMessage) {\n <span>\n SMS\n </span>\n }\n </div>\n </ng-template>\n </fs-list-column>\n <fs-list-column title=\"Customized message\">\n <ng-template\n fs-list-cell\n let-row=\"row\">\n @if (row.emailMessage?.customize || row.smsMessage?.customize) {\n @if (row.emailMessage?.customize) {\n {{ row.emailMessage.customize ? 'Email' : '' }}\n }\n @if (row.smsMessage?.customize) {\n {{ row.smsMessage.customize ? 'SMS' : '' }}\n }\n } @else {\n None\n }\n </ng-template>\n </fs-list-column>\n</fs-list>" }]
340
340
  }], propDecorators: { list: [{
341
341
  type: ViewChild,
342
342
  args: [FsListComponent, { static: true }]