@firestitch/content 12.2.5 → 12.2.7

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,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/forms'), require('@angular/material/button'), require('@angular/material/button-toggle'), require('@angular/material/dialog'), require('@angular/material/form-field'), require('@angular/material/icon'), require('@angular/material/input'), require('@angular/material/select'), require('@angular/material/tabs'), require('@firestitch/date'), require('@firestitch/dialog'), require('@firestitch/form'), require('@firestitch/html-editor'), require('@firestitch/label'), require('@firestitch/list'), require('@firestitch/skeleton'), require('@firestitch/text-editor'), require('@firestitch/common'), require('angular-split'), require('rxjs'), require('@firestitch/message'), require('rxjs/operators'), require('@firestitch/filter'), require('@angular/material/core'), require('@angular/router'), require('@angular/platform-browser'), require('@firestitch/body')) :
3
- typeof define === 'function' && define.amd ? define('@firestitch/content', ['exports', '@angular/common', '@angular/core', '@angular/forms', '@angular/material/button', '@angular/material/button-toggle', '@angular/material/dialog', '@angular/material/form-field', '@angular/material/icon', '@angular/material/input', '@angular/material/select', '@angular/material/tabs', '@firestitch/date', '@firestitch/dialog', '@firestitch/form', '@firestitch/html-editor', '@firestitch/label', '@firestitch/list', '@firestitch/skeleton', '@firestitch/text-editor', '@firestitch/common', 'angular-split', 'rxjs', '@firestitch/message', 'rxjs/operators', '@firestitch/filter', '@angular/material/core', '@angular/router', '@angular/platform-browser', '@firestitch/body'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch.content = {}), global.ng.common, global.ng.core, global.ng.forms, global.ng.material.button, global.ng.material.buttonToggle, global.ng.material.dialog, global.ng.material.formField, global.ng.material.icon, global.ng.material.input, global.ng.material.select, global.ng.material.tabs, global.i3$2, global.i3$1, global.i7$1, global.htmlEditor, global.i3, global.i2$2, global.i8, global.i4, global.i7$2, global.i2$1, global.rxjs, global.i2, global.rxjs.operators, global.filter, global.ng.material.core, global.ng.router, global.ng.platformBrowser, global.i3$3));
5
- })(this, (function (exports, i10, i0, i7, i4$1, i8$1, i1, i4$2, i5, i8$2, i5$1, tabs, i3$2, i3$1, i7$1, htmlEditor, i3, i2$2, i8, i4, i7$2, i2$1, rxjs, i2, operators, filter, i6, i2$3, i1$1, i3$3) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/forms'), require('@angular/material/button'), require('@angular/material/button-toggle'), require('@angular/material/dialog'), require('@angular/material/form-field'), require('@angular/material/icon'), require('@angular/material/input'), require('@angular/material/select'), require('@angular/material/tabs'), require('@firestitch/date'), require('@firestitch/dialog'), require('@firestitch/form'), require('@firestitch/html-editor'), require('@firestitch/label'), require('@firestitch/list'), require('@firestitch/skeleton'), require('@firestitch/text-editor'), require('@firestitch/common'), require('angular-split'), require('rxjs'), require('rxjs/operators'), require('@firestitch/message'), require('@firestitch/prompt'), require('@firestitch/filter'), require('@angular/material/core'), require('@angular/router'), require('@angular/platform-browser'), require('@firestitch/body')) :
3
+ typeof define === 'function' && define.amd ? define('@firestitch/content', ['exports', '@angular/common', '@angular/core', '@angular/forms', '@angular/material/button', '@angular/material/button-toggle', '@angular/material/dialog', '@angular/material/form-field', '@angular/material/icon', '@angular/material/input', '@angular/material/select', '@angular/material/tabs', '@firestitch/date', '@firestitch/dialog', '@firestitch/form', '@firestitch/html-editor', '@firestitch/label', '@firestitch/list', '@firestitch/skeleton', '@firestitch/text-editor', '@firestitch/common', 'angular-split', 'rxjs', 'rxjs/operators', '@firestitch/message', '@firestitch/prompt', '@firestitch/filter', '@angular/material/core', '@angular/router', '@angular/platform-browser', '@firestitch/body'], factory) :
4
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch.content = {}), global.ng.common, global.ng.core, global.ng.forms, global.ng.material.button, global.ng.material.buttonToggle, global.ng.material.dialog, global.ng.material.formField, global.ng.material.icon, global.ng.material.input, global.ng.material.select, global.ng.material.tabs, global.i3$3, global.i3$1, global.i5, global.htmlEditor, global.i3, global.i2$2, global.i8, global.i4, global.i7, global.i2$1, global.rxjs, global.rxjs.operators, global.i2, global.i3$2, global.filter, global.ng.material.core, global.ng.router, global.ng.platformBrowser, global.i3$4));
5
+ })(this, (function (exports, i10, i0, i9, i5$1, i8$1, i1, i4$1, i6, i8$2, i5$2, tabs, i3$3, i3$1, i5, htmlEditor, i3, i2$2, i8, i4, i7, i2$1, rxjs, operators, i2, i3$2, filter, i6$1, i2$3, i1$1, i3$4) { 'use strict';
6
6
 
7
7
  function _interopNamespace(e) {
8
8
  if (e && e.__esModule) return e;
@@ -24,38 +24,59 @@
24
24
 
25
25
  var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
26
26
  var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
27
- var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
28
- var i4__namespace$2 = /*#__PURE__*/_interopNamespace(i4$1);
27
+ var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
28
+ var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
29
29
  var i8__namespace$2 = /*#__PURE__*/_interopNamespace(i8$1);
30
30
  var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
31
- var i4__namespace$1 = /*#__PURE__*/_interopNamespace(i4$2);
32
- var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
31
+ var i4__namespace$1 = /*#__PURE__*/_interopNamespace(i4$1);
32
+ var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
33
33
  var i8__namespace$1 = /*#__PURE__*/_interopNamespace(i8$2);
34
- var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
35
- var i3__namespace$2 = /*#__PURE__*/_interopNamespace(i3$2);
34
+ var i5__namespace$2 = /*#__PURE__*/_interopNamespace(i5$2);
35
+ var i3__namespace$3 = /*#__PURE__*/_interopNamespace(i3$3);
36
36
  var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
37
- var i7__namespace$1 = /*#__PURE__*/_interopNamespace(i7$1);
37
+ var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
38
38
  var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
39
39
  var i2__namespace$2 = /*#__PURE__*/_interopNamespace(i2$2);
40
40
  var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
41
41
  var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
42
- var i7__namespace$2 = /*#__PURE__*/_interopNamespace(i7$2);
42
+ var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
43
43
  var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
44
44
  var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
45
- var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
45
+ var i3__namespace$2 = /*#__PURE__*/_interopNamespace(i3$2);
46
+ var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
46
47
  var i2__namespace$3 = /*#__PURE__*/_interopNamespace(i2$3);
47
48
  var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
48
- var i3__namespace$3 = /*#__PURE__*/_interopNamespace(i3$3);
49
+ var i3__namespace$4 = /*#__PURE__*/_interopNamespace(i3$4);
50
+
51
+ var EditorType;
52
+ (function (EditorType) {
53
+ EditorType["Js"] = "js";
54
+ EditorType["Html"] = "html";
55
+ EditorType["Scss"] = "scss";
56
+ EditorType["GlobalScss"] = "globalScss";
57
+ })(EditorType || (EditorType = {}));
58
+
59
+ var PageType;
60
+ (function (PageType) {
61
+ PageType["StandardPage"] = "standardPage";
62
+ PageType["BlogPost"] = "blogPost";
63
+ PageType["HomePage"] = "homePage";
64
+ PageType["NotFoundPage"] = "notFoundPage";
65
+ })(PageType || (PageType = {}));
49
66
 
50
67
  var EditorComponent = /** @class */ (function () {
51
- function EditorComponent(_message, _cdRef) {
52
- this._message = _message;
68
+ function EditorComponent(_cdRef, _message) {
53
69
  this._cdRef = _cdRef;
70
+ this._message = _message;
54
71
  this.showHtml = false;
55
72
  this.showScss = false;
56
73
  this.showJs = false;
57
74
  this.showGlobalScss = false;
58
75
  this.changed = new i0.EventEmitter();
76
+ this.focused = new i0.EventEmitter();
77
+ this.blured = new i0.EventEmitter();
78
+ this.changes = {};
79
+ this.EditorType = EditorType;
59
80
  this.resizing = false;
60
81
  this._destroy$ = new rxjs.Subject();
61
82
  }
@@ -67,35 +88,69 @@
67
88
  this._destroy$.next();
68
89
  this._destroy$.complete();
69
90
  };
70
- EditorComponent.prototype.globalScssChange = function () {
71
- var _this = this;
72
- this.contentConfig.saveContentStyle(this.contentStyle)
73
- .subscribe(function (contentStyle) {
74
- _this.contentStyle = contentStyle;
75
- _this._message.success('Saved Changes');
76
- _this._cdRef.markForCheck();
77
- });
91
+ EditorComponent.prototype.change = function (type, value) {
92
+ this.changed.emit({ type: type, value: value });
93
+ this.changes[type] = value;
94
+ };
95
+ Object.defineProperty(EditorComponent.prototype, "hasChanges", {
96
+ get: function () {
97
+ var _this = this;
98
+ return Object.keys(this.changes)
99
+ .filter(function (name) { return !!_this.changes[name]; })
100
+ .length !== 0;
101
+ },
102
+ enumerable: false,
103
+ configurable: true
104
+ });
105
+ EditorComponent.prototype.clearChange = function (type) {
106
+ this.changes[type] = null;
107
+ this._cdRef.markForCheck();
78
108
  };
79
109
  EditorComponent.prototype.initTextEditors = function () {
110
+ var _this = this;
80
111
  this.scssConfig = {
81
112
  tabSize: 2,
82
113
  language: 'scss',
83
114
  height: '100%',
115
+ focus: function () {
116
+ _this.focused.emit(EditorType.Scss);
117
+ },
118
+ blur: function () {
119
+ _this.blured.emit(EditorType.Scss);
120
+ },
84
121
  };
85
122
  this.jsConfig = {
86
123
  tabSize: 2,
87
124
  language: 'js',
88
125
  height: '100%',
126
+ focus: function () {
127
+ _this.focused.emit(EditorType.Js);
128
+ },
129
+ blur: function () {
130
+ _this.blured.emit(EditorType.Js);
131
+ },
89
132
  };
90
133
  this.htmlConfig = {
91
134
  tabSize: 2,
92
135
  language: 'html',
93
136
  height: '100%',
137
+ focus: function () {
138
+ _this.focused.emit(EditorType.Html);
139
+ },
140
+ blur: function () {
141
+ _this.blured.emit(EditorType.Html);
142
+ },
94
143
  };
95
144
  this.globalScssConfig = {
96
145
  tabSize: 2,
97
146
  language: 'scss',
98
147
  height: '100%',
148
+ focus: function () {
149
+ _this.focused.emit(EditorType.GlobalScss);
150
+ },
151
+ blur: function () {
152
+ _this.blured.emit(EditorType.GlobalScss);
153
+ },
99
154
  };
100
155
  };
101
156
  EditorComponent.prototype.initGlobalContentStyle = function () {
@@ -106,10 +161,17 @@
106
161
  _this._cdRef.markForCheck();
107
162
  });
108
163
  };
164
+ EditorComponent.prototype.saveGlobalScss = function () {
165
+ var _this = this;
166
+ return this.contentConfig.saveContentStyle(this.contentStyle)
167
+ .pipe(operators.tap(function () {
168
+ _this._message.success('Saved Changes');
169
+ }));
170
+ };
109
171
  return EditorComponent;
110
172
  }());
111
- EditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: EditorComponent, deps: [{ token: i2__namespace.FsMessage }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
112
- EditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: EditorComponent, selector: "app-editor", inputs: { showHtml: "showHtml", showScss: "showScss", showJs: "showJs", showGlobalScss: "showGlobalScss", html: "html", scss: "scss", js: "js", contentConfig: "contentConfig" }, outputs: { changed: "changed" }, ngImport: i0__namespace, template: "<as-split [unit]=\"'percent'\" [gutterSize]=\"25\"> \n <as-split-area [size]=\"70\" [visible]=\"showHtml\" [order]=\"1\">\n <div class=\"editor-container\">\n <fs-label>HTML</fs-label>\n <fs-text-editor \n [(ngModel)]=\"html\" \n name=\"html\"\n [fsModelChangeOptions]=\"{ debounce: 300 }\"\n (fsModelChange)=\"changed.emit({ type: 'html', value: $event })\"\n [config]=\"htmlConfig\">\n </fs-text-editor> \n </div>\n </as-split-area>\n <as-split-area [size]=\"30\" [visible]=\"showScss\" [order]=\"2\">\n <div class=\"editor-container\">\n <fs-label>SCSS</fs-label>\n <fs-text-editor \n [(ngModel)]=\"scss\" \n name=\"scss\"\n [fsModelChangeOptions]=\"{ debounce: 300 }\"\n (fsModelChange)=\"changed.emit({ type: 'scss', value: $event })\"\n [config]=\"scssConfig\">\n </fs-text-editor> \n </div>\n </as-split-area>\n <as-split-area [size]=\"30\" [visible]=\"showJs\" [order]=\"3\">\n <div class=\"editor-container\">\n <fs-label>JS</fs-label>\n <fs-text-editor \n [(ngModel)]=\"js\" \n name=\"js\"\n [fsModelChangeOptions]=\"{ debounce: 300 }\"\n (fsModelChange)=\"changed.emit({ type: 'js', value: $event })\"\n [config]=\"jsConfig\">\n </fs-text-editor> \n </div>\n </as-split-area>\n <as-split-area [size]=\"30\" [visible]=\"showGlobalScss\" [order]=\"4\">\n <div class=\"editor-container\">\n <fs-label>Global SCSS</fs-label>\n <ng-container *fsSkeleton=\"contentStyle\">\n <fs-text-editor \n [(ngModel)]=\"contentStyle.scss\" \n name=\"globalScss\"\n [fsModelChangeOptions]=\"{ debounce: 300 }\"\n (fsModelChange)=\"globalScssChange()\"\n [config]=\"globalScssConfig\">\n </fs-text-editor> \n </ng-container> \n </div>\n </as-split-area>\n</as-split>\n", styles: [":host ::ng-deep .as-split-gutter{background-color:unset!important}.editor-container{height:100%;border-radius:5px;display:flex;flex-direction:column}.editor-container fs-text-editor{flex:1}\n"], components: [{ type: i2__namespace$1.SplitComponent, selector: "as-split", inputs: ["direction", "unit", "gutterSize", "gutterStep", "restrictMove", "useTransition", "disabled", "dir", "gutterDblClickDuration", "gutterClickDeltaPx", "gutterAriaLabel"], outputs: ["transitionEnd", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"], exportAs: ["asSplit"] }, { type: i3__namespace.FsLabelComponent, selector: "fs-label" }, { type: i4__namespace.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["ready", "blur"] }], directives: [{ type: i2__namespace$1.SplitAreaDirective, selector: "as-split-area, [as-split-area]", inputs: ["order", "size", "minSize", "maxSize", "lockSize", "visible"], exportAs: ["asSplitArea"] }, { type: i7__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7__namespace$1.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { type: i7__namespace$2.FsModelChangeDirective, selector: "[fsModelChange]", inputs: ["fsModelChangeOptions"], outputs: ["fsModelChange"] }, { type: i8__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
173
+ EditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: EditorComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i2__namespace.FsMessage }], target: i0__namespace.ɵɵFactoryTarget.Component });
174
+ EditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: EditorComponent, selector: "app-editor", inputs: { showHtml: "showHtml", showScss: "showScss", showJs: "showJs", showGlobalScss: "showGlobalScss", html: "html", scss: "scss", js: "js", contentConfig: "contentConfig" }, outputs: { changed: "changed", focused: "focused", blured: "blured" }, ngImport: i0__namespace, template: "<as-split [unit]=\"'percent'\" [gutterSize]=\"25\"> \n <as-split-area [size]=\"70\" [visible]=\"showHtml\" [order]=\"1\">\n <div class=\"editor-container\">\n <fs-label>HTML {{changes.html ? '*' : ''}}</fs-label>\n <fs-text-editor \n [(ngModel)]=\"html\" \n name=\"html\"\n [fsModelChangeOptions]=\"{ debounce: 0 }\"\n (fsModelChange)=\"change(EditorType.Html, $event)\"\n [config]=\"htmlConfig\">\n </fs-text-editor> \n </div>\n </as-split-area>\n <as-split-area [size]=\"30\" [visible]=\"showScss\" [order]=\"2\">\n <div class=\"editor-container\">\n <fs-label>SCSS {{changes.scss ? '*' : ''}}</fs-label>\n <fs-text-editor \n [(ngModel)]=\"scss\" \n name=\"scss\"\n [fsModelChangeOptions]=\"{ debounce: 0 }\"\n (fsModelChange)=\"change(EditorType.Scss, $event)\"\n [config]=\"scssConfig\">\n </fs-text-editor> \n </div>\n </as-split-area>\n <as-split-area [size]=\"30\" [visible]=\"showJs\" [order]=\"3\">\n <div class=\"editor-container\">\n <fs-label>JS {{changes.js ? '*' : ''}}</fs-label>\n <fs-text-editor \n [(ngModel)]=\"js\" \n name=\"js\"\n [fsModelChangeOptions]=\"{ debounce: 0 }\"\n (fsModelChange)=\"change(EditorType.Js, $event)\"\n [config]=\"jsConfig\">\n </fs-text-editor> \n </div>\n </as-split-area>\n <as-split-area [size]=\"30\" [visible]=\"showGlobalScss\" [order]=\"4\">\n <div class=\"editor-container\">\n <fs-label>Global SCSS {{changes.globalScss ? '*' : ''}}</fs-label>\n <ng-container *fsSkeleton=\"contentStyle\">\n <fs-text-editor \n [(ngModel)]=\"contentStyle.scss\" \n name=\"globalScss\"\n [fsModelChangeOptions]=\"{ debounce: 300 }\"\n (fsModelChange)=\"change(EditorType.GlobalScss, $event)\"\n [config]=\"globalScssConfig\">\n </fs-text-editor> \n </ng-container> \n </div>\n </as-split-area>\n</as-split>\n", styles: [":host ::ng-deep .as-split-gutter{background-color:unset!important}.editor-container{height:100%;border-radius:5px;display:flex;flex-direction:column}.editor-container fs-text-editor{flex:1}\n"], components: [{ type: i2__namespace$1.SplitComponent, selector: "as-split", inputs: ["direction", "unit", "gutterSize", "gutterStep", "restrictMove", "useTransition", "disabled", "dir", "gutterDblClickDuration", "gutterClickDeltaPx", "gutterAriaLabel"], outputs: ["transitionEnd", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"], exportAs: ["asSplit"] }, { type: i3__namespace.FsLabelComponent, selector: "fs-label" }, { type: i4__namespace.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["ready", "blur"] }], directives: [{ type: i2__namespace$1.SplitAreaDirective, selector: "as-split-area, [as-split-area]", inputs: ["order", "size", "minSize", "maxSize", "lockSize", "visible"], exportAs: ["asSplitArea"] }, { type: i9__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i9__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5__namespace.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { type: i7__namespace.FsModelChangeDirective, selector: "[fsModelChange]", inputs: ["fsModelChangeOptions"], outputs: ["fsModelChange"] }, { type: i8__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
113
175
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: EditorComponent, decorators: [{
114
176
  type: i0.Component,
115
177
  args: [{
@@ -118,7 +180,7 @@
118
180
  styleUrls: ['./editor.component.scss'],
119
181
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
120
182
  }]
121
- }], ctorParameters: function () { return [{ type: i2__namespace.FsMessage }, { type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { showHtml: [{
183
+ }], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }, { type: i2__namespace.FsMessage }]; }, propDecorators: { showHtml: [{
122
184
  type: i0.Input
123
185
  }], showScss: [{
124
186
  type: i0.Input
@@ -136,6 +198,10 @@
136
198
  type: i0.Input
137
199
  }], changed: [{
138
200
  type: i0.Output
201
+ }], focused: [{
202
+ type: i0.Output
203
+ }], blured: [{
204
+ type: i0.Output
139
205
  }] } });
140
206
 
141
207
  var FsContentEditorModule = /** @class */ (function () {
@@ -145,35 +211,35 @@
145
211
  }());
146
212
  FsContentEditorModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
147
213
  FsContentEditorModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, declarations: [EditorComponent], imports: [i10.CommonModule,
148
- i7.FormsModule,
214
+ i9.FormsModule,
149
215
  i1.MatDialogModule,
150
- i4$1.MatButtonModule,
216
+ i5$1.MatButtonModule,
151
217
  tabs.MatTabsModule,
152
- i5.MatIconModule,
218
+ i6.MatIconModule,
153
219
  i8$1.MatButtonToggleModule,
154
220
  i2$2.FsListModule,
155
- i7$1.FsFormModule,
221
+ i5.FsFormModule,
156
222
  i8.FsSkeletonModule,
157
223
  i3.FsLabelModule,
158
224
  htmlEditor.FsHtmlEditorModule,
159
- i7$2.FsCommonModule,
225
+ i7.FsCommonModule,
160
226
  i3$1.FsDialogModule,
161
227
  i4.FsTextEditorModule,
162
228
  i2$1.AngularSplitModule], exports: [EditorComponent] });
163
229
  FsContentEditorModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, imports: [[
164
230
  i10.CommonModule,
165
- i7.FormsModule,
231
+ i9.FormsModule,
166
232
  i1.MatDialogModule,
167
- i4$1.MatButtonModule,
233
+ i5$1.MatButtonModule,
168
234
  tabs.MatTabsModule,
169
- i5.MatIconModule,
235
+ i6.MatIconModule,
170
236
  i8$1.MatButtonToggleModule,
171
237
  i2$2.FsListModule,
172
- i7$1.FsFormModule,
238
+ i5.FsFormModule,
173
239
  i8.FsSkeletonModule,
174
240
  i3.FsLabelModule,
175
241
  htmlEditor.FsHtmlEditorModule,
176
- i7$2.FsCommonModule,
242
+ i7.FsCommonModule,
177
243
  i3$1.FsDialogModule,
178
244
  i4.FsTextEditorModule,
179
245
  i2$1.AngularSplitModule,
@@ -183,18 +249,18 @@
183
249
  args: [{
184
250
  imports: [
185
251
  i10.CommonModule,
186
- i7.FormsModule,
252
+ i9.FormsModule,
187
253
  i1.MatDialogModule,
188
- i4$1.MatButtonModule,
254
+ i5$1.MatButtonModule,
189
255
  tabs.MatTabsModule,
190
- i5.MatIconModule,
256
+ i6.MatIconModule,
191
257
  i8$1.MatButtonToggleModule,
192
258
  i2$2.FsListModule,
193
- i7$1.FsFormModule,
259
+ i5.FsFormModule,
194
260
  i8.FsSkeletonModule,
195
261
  i3.FsLabelModule,
196
262
  htmlEditor.FsHtmlEditorModule,
197
- i7$2.FsCommonModule,
263
+ i7.FsCommonModule,
198
264
  i3$1.FsDialogModule,
199
265
  i4.FsTextEditorModule,
200
266
  i2$1.AngularSplitModule,
@@ -250,7 +316,7 @@
250
316
  return ContentLayoutComponent;
251
317
  }());
252
318
  ContentLayoutComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentLayoutComponent, deps: [{ token: FS_CONTENT_CONFIG }, { token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i2__namespace.FsMessage }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
253
- ContentLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentLayoutComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i4.FsTextEditorComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\" *fsSkeletonForm=\"contentLayout\">\n <fs-dialog>\n <h1 mat-dialog-title>{{contentLayout.id ? 'Layout' : 'Layout Page'}}</h1>\n <div mat-dialog-content>\n <div class=\"fs-column\">\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentLayout.name\"\n name=\"name\"\n required\n placeholder=\"Name\">\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentLayout.tag\"\n name=\"tag\"\n placeholder=\"Tag\">\n </mat-form-field>\n </div>\n </div>\n\n <div mat-dialog-actions>\n <fs-form-dialog-actions>\n </fs-form-dialog-actions>\n </div>\n </fs-dialog>\n</form>\n", styles: [""], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace$1.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i7__namespace$1.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i7__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i7__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7__namespace$1.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"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i8__namespace$1.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: i7__namespace.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: i7__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i7__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7__namespace$1.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i7__namespace$1.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
319
+ ContentLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentLayoutComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i4.FsTextEditorComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\" *fsSkeletonForm=\"contentLayout\">\n <fs-dialog>\n <h1 mat-dialog-title>{{contentLayout.id ? 'Layout' : 'Layout Page'}}</h1>\n <div mat-dialog-content>\n <div class=\"fs-column\">\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentLayout.name\"\n name=\"name\"\n required\n placeholder=\"Name\">\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentLayout.tag\"\n name=\"tag\"\n placeholder=\"Tag\">\n </mat-form-field>\n </div>\n </div>\n\n <div mat-dialog-actions>\n <fs-form-dialog-actions>\n </fs-form-dialog-actions>\n </div>\n </fs-dialog>\n</form>\n", styles: [""], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace$1.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i5__namespace.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i9__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i9__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i9__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5__namespace.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"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i8__namespace$1.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: i9__namespace.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: i9__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i9__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i9__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5__namespace.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i5__namespace.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
254
320
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentLayoutComponent, decorators: [{
255
321
  type: i0.Component,
256
322
  args: [{
@@ -272,22 +338,43 @@
272
338
  }] } });
273
339
 
274
340
  var ContentLayoutEditorComponent = /** @class */ (function () {
275
- function ContentLayoutEditorComponent(_data, _dialogRef, _message, _dialog, _cdRef) {
341
+ function ContentLayoutEditorComponent(_data, _dialogRef, _message, _dialog, _cdRef, _prompt) {
342
+ var _a;
343
+ var _this = this;
276
344
  this._data = _data;
277
345
  this._dialogRef = _dialogRef;
278
346
  this._message = _message;
279
347
  this._dialog = _dialog;
280
348
  this._cdRef = _cdRef;
281
- this.resizing = false;
282
- this.editors = {
283
- html: true,
284
- scss: true,
285
- globalScss: false,
286
- };
349
+ this._prompt = _prompt;
350
+ this.EditorType = EditorType;
351
+ this.focused = null;
352
+ this.editors = (_a = {},
353
+ _a[EditorType.Html] = true,
354
+ _a[EditorType.Scss] = true,
355
+ _a[EditorType.GlobalScss] = false,
356
+ _a);
287
357
  this._destroy$ = new rxjs.Subject();
358
+ this.save = function () {
359
+ return rxjs.of(null)
360
+ .pipe(operators.filter(function () { return _this.focused; }), operators.switchMap(function () {
361
+ switch (_this.focused) {
362
+ case EditorType.Html:
363
+ case EditorType.Scss:
364
+ return _this.saveContentPage();
365
+ case EditorType.GlobalScss:
366
+ return _this.editor.saveGlobalScss();
367
+ }
368
+ return rxjs.throwError('Invalid focus');
369
+ }), operators.tap(function () {
370
+ _this.editor.clearChange(_this.focused);
371
+ _this._cdRef.markForCheck();
372
+ }));
373
+ };
288
374
  }
289
375
  ContentLayoutEditorComponent.prototype.ngOnInit = function () {
290
376
  this._dialogRef.addPanelClass('fs-content-editor-overlay-pane');
377
+ this._dialogRef.disableClose = true;
291
378
  this.config = this._data.contentConfig;
292
379
  this._initContentLayout(this._data.contentLayout);
293
380
  };
@@ -306,25 +393,54 @@
306
393
  _this._cdRef.markForCheck();
307
394
  });
308
395
  };
309
- ContentLayoutEditorComponent.prototype.editorChanged = function (event) {
310
- var data = {};
311
- if (event.type === 'html') {
312
- data.content = event.value;
313
- }
314
- if (event.type === 'scss') {
315
- data.styles = event.value;
316
- }
317
- this.saveContentLayout(data);
396
+ ContentLayoutEditorComponent.prototype.editorFocused = function (type) {
397
+ this.focused = type;
318
398
  };
319
- ContentLayoutEditorComponent.prototype.saveContentLayout = function (data) {
399
+ ContentLayoutEditorComponent.prototype.saveContentPage = function () {
400
+ var _a, _b;
320
401
  var _this = this;
321
- this.config.saveContentLayout(Object.assign({ id: this.contentLayout.id }, data))
322
- .pipe(operators.tap(function (contentLayout) {
323
- _this.contentLayout = Object.assign(Object.assign({}, _this.contentLayout), contentLayout);
324
- _this._cdRef.markForCheck();
402
+ var names = (_a = {},
403
+ _a[EditorType.Scss] = 'styles',
404
+ _a[EditorType.Html] = 'content',
405
+ _a);
406
+ var data = (_b = {
407
+ id: this.contentLayout.id
408
+ },
409
+ _b[names[this.focused]] = this.editor.changes[this.focused],
410
+ _b);
411
+ return this.config.saveContentLayout(Object.assign({ id: this.contentLayout.id }, data))
412
+ .pipe(operators.tap(function () {
325
413
  _this._message.success('Saved Changes');
326
- }))
327
- .subscribe();
414
+ }));
415
+ };
416
+ ContentLayoutEditorComponent.prototype.cancel = function () {
417
+ var _this = this;
418
+ if (!this.editor.hasChanges) {
419
+ return this._dialogRef.close();
420
+ }
421
+ this._prompt.confirm({
422
+ dialogConfig: {
423
+ width: null,
424
+ },
425
+ title: 'You have unsaved changes',
426
+ template: 'What would you like to do with your changes?',
427
+ buttons: [
428
+ {
429
+ label: 'Review Changes',
430
+ value: 'review',
431
+ },
432
+ {
433
+ label: 'Discard Changes',
434
+ value: 'discard',
435
+ },
436
+ ],
437
+ })
438
+ .pipe(operators.takeUntil(this._destroy$))
439
+ .subscribe(function (value) {
440
+ if (value === 'discard') {
441
+ _this._dialogRef.close();
442
+ }
443
+ });
328
444
  };
329
445
  ContentLayoutEditorComponent.prototype.openSettings = function () {
330
446
  var _this = this;
@@ -342,8 +458,8 @@
342
458
  };
343
459
  return ContentLayoutEditorComponent;
344
460
  }());
345
- ContentLayoutEditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentLayoutEditorComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i2__namespace.FsMessage }, { token: i1__namespace.MatDialog }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
346
- ContentLayoutEditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentLayoutEditorComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog *fsSkeletonForm=\"contentLayout\">\n <h1 mat-dialog-title>\n <div class=\"title-container\">\n <div class=\"title\">\n Layout Editor\n <div class=\"small\">{{contentLayout.name}}</div> \n </div>\n <a\n (click)=\"openSettings()\"\n mat-icon-button>\n <mat-icon>settings</mat-icon>\n </a> \n </div>\n </h1>\n <div mat-dialog-content>\n <app-editor\n [contentConfig]=\"config\"\n [showHtml]=\"editors.html\"\n [showScss]=\"editors.scss\"\n [showGlobalScss]=\"editors.globalScss\"\n [html]=\"contentLayout.content\"\n [scss]=\"contentLayout.styles\"\n (changed)=\"editorChanged($event)\">\n </app-editor>\n </div>\n\n <div mat-dialog-actions>\n <fs-form-dialog-actions\n [save]=\"false\"\n [done]=\"true\">\n </fs-form-dialog-actions>\n <div class=\"toggles\">\n <mat-button-toggle-group multiple>\n <mat-button-toggle value=\"html\" [checked]=\"editors.html\" (change)=\"editorToggleChange($event)\">HTML</mat-button-toggle>\n <mat-button-toggle value=\"scss\" [checked]=\"editors.scss\" (change)=\"editorToggleChange($event)\">SCSS</mat-button-toggle>\n <mat-button-toggle value=\"globalScss\" [checked]=\"editors.globalScss\" (change)=\"editorToggleChange($event)\">Global SCSS</mat-button-toggle>\n </mat-button-toggle-group> \n </div>\n </div>\n</fs-dialog>\n\n", styles: ["::ng-deep .fs-content-editor-overlay-pane .mat-dialog-container{border-radius:0}fs-dialog{display:flex;height:100%;flex-direction:column}fs-dialog ::ng-deep .mat-dialog-content{max-height:none;flex:1;overflow:hidden}.mat-dialog-actions fs-form-dialog-actions{width:auto}.mat-dialog-actions .toggles{display:flex;justify-content:flex-end;justify-self:baseline;flex:1}.title-container{display:flex;align-items:center}.title-container .title{flex:1}.title-container .title .small{line-height:normal}\n"], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace$2.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab], a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i5__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: EditorComponent, selector: "app-editor", inputs: ["showHtml", "showScss", "showJs", "showGlobalScss", "html", "scss", "js", "contentConfig"], outputs: ["changed"] }, { type: i7__namespace$1.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }, { type: i8__namespace$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-labelledby", "tabIndex", "appearance", "checked", "disabled", "id", "name", "aria-label", "value"], outputs: ["change"], exportAs: ["matButtonToggle"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i8__namespace$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
461
+ ContentLayoutEditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentLayoutEditorComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i2__namespace.FsMessage }, { token: i1__namespace.MatDialog }, { token: i0__namespace.ChangeDetectorRef }, { token: i3__namespace$2.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
462
+ ContentLayoutEditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentLayoutEditorComponent, selector: "ng-component", viewQueries: [{ propertyName: "editor", first: true, predicate: EditorComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\" [dirtySubmitButton]=\"false\" [confirm]=\"false\">\n <fs-dialog *fsSkeletonForm=\"contentLayout\">\n <h1 mat-dialog-title>\n <div class=\"title-container\">\n <div class=\"title\">\n Layout Editor\n <div class=\"small\">{{contentLayout.name}}</div> \n </div>\n <a\n (click)=\"openSettings()\"\n mat-icon-button>\n <mat-icon>settings</mat-icon>\n </a> \n </div>\n </h1>\n <div mat-dialog-content>\n <app-editor\n [contentConfig]=\"config\"\n [showHtml]=\"editors.html\"\n [showScss]=\"editors.scss\"\n [showGlobalScss]=\"editors.globalScss\"\n [html]=\"contentLayout.content\"\n [scss]=\"contentLayout.styles\"\n (focused)=\"editorFocused($event)\">\n </app-editor>\n </div>\n\n <div mat-dialog-actions>\n <button \n mat-button\n color=\"primary\"\n (click)=\"cancel()\"\n type=\"button\"> \n Done \n </button>\n <div class=\"toggles\">\n <mat-button-toggle-group multiple>\n <mat-button-toggle value=\"html\" [checked]=\"editors.html\" (change)=\"editorToggleChange($event)\">HTML</mat-button-toggle>\n <mat-button-toggle value=\"scss\" [checked]=\"editors.scss\" (change)=\"editorToggleChange($event)\">SCSS</mat-button-toggle>\n <mat-button-toggle value=\"globalScss\" [checked]=\"editors.globalScss\" (change)=\"editorToggleChange($event)\">Global SCSS</mat-button-toggle>\n </mat-button-toggle-group> \n </div>\n </div>\n </fs-dialog>\n</form>", styles: ["::ng-deep .fs-content-editor-overlay-pane .mat-dialog-container{border-radius:0}form{height:100%}fs-dialog{display:flex;height:100%;flex-direction:column}fs-dialog ::ng-deep .mat-dialog-content{max-height:none;flex:1;overflow:hidden}.mat-dialog-actions .toggles{display:flex;justify-content:flex-end;justify-self:baseline;flex:1}.title-container{display:flex;align-items:center}.title-container .title{flex:1}.title-container .title .small{line-height:normal}\n"], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i5__namespace$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab], a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i6__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: EditorComponent, selector: "app-editor", inputs: ["showHtml", "showScss", "showJs", "showGlobalScss", "html", "scss", "js", "contentConfig"], outputs: ["changed", "focused", "blured"] }, { type: i5__namespace$1.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"] }, { type: i8__namespace$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-labelledby", "tabIndex", "appearance", "checked", "disabled", "id", "name", "aria-label", "value"], outputs: ["change"], exportAs: ["matButtonToggle"] }], directives: [{ type: i9__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i9__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i9__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5__namespace.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"] }, { type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i5__namespace.FsButtonDirective, selector: "[mat-raised-button],[mat-button],[mat-flat-button],[mat-stroked-button]", inputs: ["name", "dirtySubmit", "form"] }, { type: i8__namespace$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
347
463
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentLayoutEditorComponent, decorators: [{
348
464
  type: i0.Component,
349
465
  args: [{
@@ -355,8 +471,11 @@
355
471
  return [{ type: undefined, decorators: [{
356
472
  type: i0.Inject,
357
473
  args: [i1.MAT_DIALOG_DATA]
358
- }] }, { type: i1__namespace.MatDialogRef }, { type: i2__namespace.FsMessage }, { type: i1__namespace.MatDialog }, { type: i0__namespace.ChangeDetectorRef }];
359
- } });
474
+ }] }, { type: i1__namespace.MatDialogRef }, { type: i2__namespace.FsMessage }, { type: i1__namespace.MatDialog }, { type: i0__namespace.ChangeDetectorRef }, { type: i3__namespace$2.FsPrompt }];
475
+ }, propDecorators: { editor: [{
476
+ type: i0.ViewChild,
477
+ args: [EditorComponent]
478
+ }] } });
360
479
 
361
480
  var FsContentLayoutsComponent = /** @class */ (function () {
362
481
  function FsContentLayoutsComponent(_config, _dialog) {
@@ -452,7 +571,7 @@
452
571
  return FsContentLayoutsComponent;
453
572
  }());
454
573
  FsContentLayoutsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentLayoutsComponent, deps: [{ token: FS_CONTENT_CONFIG }, { token: i1__namespace.MatDialog }], target: i0__namespace.ɵɵFactoryTarget.Component });
455
- FsContentLayoutsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsContentLayoutsComponent, selector: "fs-content-layouts", viewQueries: [{ propertyName: "listComponent", first: true, predicate: i2$2.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\">\n <fs-list-column name=\"name\" title=\"Name\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openEditor(row)\">{{row.name}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"modify_date\" title=\"Modified\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.modifyDate | fsDate: 'date-time-yearless'}}\n </ng-template>\n </fs-list-column>\n</fs-list>\n", styles: [""], components: [{ type: i2__namespace$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2__namespace$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i3__namespace$2.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
574
+ FsContentLayoutsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsContentLayoutsComponent, selector: "fs-content-layouts", viewQueries: [{ propertyName: "listComponent", first: true, predicate: i2$2.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\">\n <fs-list-column name=\"name\" title=\"Name\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openEditor(row)\">{{row.name}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"modify_date\" title=\"Modified\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.modifyDate | fsDate: 'date-time-yearless'}}\n </ng-template>\n </fs-list-column>\n</fs-list>\n", styles: [""], components: [{ type: i2__namespace$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2__namespace$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i3__namespace$3.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
456
575
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentLayoutsComponent, decorators: [{
457
576
  type: i0.Component,
458
577
  args: [{
@@ -480,18 +599,18 @@
480
599
  FsContentLayoutsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentLayoutsModule, declarations: [ContentLayoutComponent,
481
600
  FsContentLayoutsComponent,
482
601
  ContentLayoutEditorComponent], imports: [i10.CommonModule,
483
- i7.FormsModule,
602
+ i9.FormsModule,
484
603
  i1.MatDialogModule,
485
604
  i8$2.MatInputModule,
486
- i4$2.MatFormFieldModule,
487
- i4$1.MatButtonModule,
605
+ i4$1.MatFormFieldModule,
606
+ i5$1.MatButtonModule,
488
607
  tabs.MatTabsModule,
489
- i5.MatIconModule,
490
- i5$1.MatSelectModule,
608
+ i6.MatIconModule,
609
+ i5$2.MatSelectModule,
491
610
  i8$1.MatButtonToggleModule,
492
611
  i2$2.FsListModule,
493
- i3$2.FsDateModule,
494
- i7$1.FsFormModule,
612
+ i3$3.FsDateModule,
613
+ i5.FsFormModule,
495
614
  i3.FsLabelModule,
496
615
  i8.FsSkeletonModule,
497
616
  htmlEditor.FsHtmlEditorModule,
@@ -500,18 +619,18 @@
500
619
  FsContentEditorModule], exports: [FsContentLayoutsComponent] });
501
620
  FsContentLayoutsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentLayoutsModule, imports: [[
502
621
  i10.CommonModule,
503
- i7.FormsModule,
622
+ i9.FormsModule,
504
623
  i1.MatDialogModule,
505
624
  i8$2.MatInputModule,
506
- i4$2.MatFormFieldModule,
507
- i4$1.MatButtonModule,
625
+ i4$1.MatFormFieldModule,
626
+ i5$1.MatButtonModule,
508
627
  tabs.MatTabsModule,
509
- i5.MatIconModule,
510
- i5$1.MatSelectModule,
628
+ i6.MatIconModule,
629
+ i5$2.MatSelectModule,
511
630
  i8$1.MatButtonToggleModule,
512
631
  i2$2.FsListModule,
513
- i3$2.FsDateModule,
514
- i7$1.FsFormModule,
632
+ i3$3.FsDateModule,
633
+ i5.FsFormModule,
515
634
  i3.FsLabelModule,
516
635
  i8.FsSkeletonModule,
517
636
  htmlEditor.FsHtmlEditorModule,
@@ -524,18 +643,18 @@
524
643
  args: [{
525
644
  imports: [
526
645
  i10.CommonModule,
527
- i7.FormsModule,
646
+ i9.FormsModule,
528
647
  i1.MatDialogModule,
529
648
  i8$2.MatInputModule,
530
- i4$2.MatFormFieldModule,
531
- i4$1.MatButtonModule,
649
+ i4$1.MatFormFieldModule,
650
+ i5$1.MatButtonModule,
532
651
  tabs.MatTabsModule,
533
- i5.MatIconModule,
534
- i5$1.MatSelectModule,
652
+ i6.MatIconModule,
653
+ i5$2.MatSelectModule,
535
654
  i8$1.MatButtonToggleModule,
536
655
  i2$2.FsListModule,
537
- i3$2.FsDateModule,
538
- i7$1.FsFormModule,
656
+ i3$3.FsDateModule,
657
+ i5.FsFormModule,
539
658
  i3.FsLabelModule,
540
659
  i8.FsSkeletonModule,
541
660
  htmlEditor.FsHtmlEditorModule,
@@ -554,14 +673,6 @@
554
673
  }]
555
674
  }] });
556
675
 
557
- var PageType;
558
- (function (PageType) {
559
- PageType["StandardPage"] = "standardPage";
560
- PageType["BlogPost"] = "blogPost";
561
- PageType["HomePage"] = "homePage";
562
- PageType["NotFoundPage"] = "notFoundPage";
563
- })(PageType || (PageType = {}));
564
-
565
676
  var PageTypes = [
566
677
  { name: 'Standard Page', value: PageType.StandardPage },
567
678
  { name: 'Home Page', value: PageType.HomePage },
@@ -616,7 +727,7 @@
616
727
  return ContentPageComponent;
617
728
  }());
618
729
  ContentPageComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageComponent, deps: [{ token: FS_CONTENT_CONFIG }, { token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i2__namespace.FsMessage }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
619
- ContentPageComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentPageComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i4.FsTextEditorComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\" *fsSkeletonForm=\"contentPage\">\n <fs-dialog>\n <h1 mat-dialog-title>{{contentPage.id ? 'Page' : 'Create Page'}}</h1>\n <div mat-dialog-content>\n <div class=\"fs-column\">\n <mat-form-field>\n <mat-select\n [(ngModel)]=\"contentPage.type\"\n name=\"type\"\n required\n placeholder=\"Type\">\n <mat-option\n *ngFor=\"let item of PageTypes\"\n [value]=\"item.value\">\n {{ item.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field *ngIf=\"contentLayouts\">\n <mat-select\n [(ngModel)]=\"contentPage.contentLayoutId\"\n required\n name=\"contentLayoutId\"\n placeholder=\"Layout\">\n <mat-option\n *ngFor=\"let item of contentLayouts\"\n [value]=\"item.id\">\n {{ item.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentPage.name\"\n name=\"name\"\n required\n placeholder=\"Name\">\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentPage.path\"\n name=\"path\"\n required\n placeholder=\"Path\">\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentPage.title\"\n name=\"title\"\n placeholder=\"Title\">\n </mat-form-field>\n </div>\n </div>\n\n <div mat-dialog-actions>\n <fs-form-dialog-actions>\n </fs-form-dialog-actions>\n </div>\n </fs-dialog>\n</form>\n", styles: [""], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace$1.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i5__namespace$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6__namespace.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i7__namespace$1.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i7__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i7__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7__namespace$1.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"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i7__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i7__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7__namespace$1.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i10__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8__namespace$1.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: i7__namespace.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: i7__namespace$1.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
730
+ ContentPageComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentPageComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i4.FsTextEditorComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\" *fsSkeletonForm=\"contentPage\">\n <fs-dialog>\n <h1 mat-dialog-title>{{contentPage.id ? 'Page' : 'Create Page'}}</h1>\n <div mat-dialog-content>\n <div class=\"fs-column\">\n <mat-form-field>\n <mat-select\n [(ngModel)]=\"contentPage.type\"\n name=\"type\"\n required\n placeholder=\"Type\">\n <mat-option\n *ngFor=\"let item of PageTypes\"\n [value]=\"item.value\">\n {{ item.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field *ngIf=\"contentLayouts\">\n <mat-select\n [(ngModel)]=\"contentPage.contentLayoutId\"\n required\n name=\"contentLayoutId\"\n placeholder=\"Layout\">\n <mat-option\n *ngFor=\"let item of contentLayouts\"\n [value]=\"item.id\">\n {{ item.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentPage.name\"\n name=\"name\"\n required\n placeholder=\"Name\">\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentPage.path\"\n name=\"path\"\n required\n placeholder=\"Path\">\n </mat-form-field>\n <mat-form-field>\n <input\n matInput\n [(ngModel)]=\"contentPage.title\"\n name=\"title\"\n placeholder=\"Title\">\n </mat-form-field>\n </div>\n </div>\n\n <div mat-dialog-actions>\n <fs-form-dialog-actions>\n </fs-form-dialog-actions>\n </div>\n </fs-dialog>\n</form>\n", styles: [""], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace$1.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i5__namespace$2.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6__namespace$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i5__namespace.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i9__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i9__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i9__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5__namespace.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"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i9__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i9__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i9__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5__namespace.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i10__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8__namespace$1.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: i9__namespace.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: i5__namespace.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
620
731
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageComponent, decorators: [{
621
732
  type: i0.Component,
622
733
  args: [{
@@ -638,23 +749,45 @@
638
749
  }] } });
639
750
 
640
751
  var ContentPageEditorComponent = /** @class */ (function () {
641
- function ContentPageEditorComponent(_data, _dialogRef, _message, _dialog, _cdRef) {
752
+ function ContentPageEditorComponent(_data, _dialogRef, _message, _dialog, _cdRef, _prompt) {
753
+ var _a;
754
+ var _this = this;
642
755
  this._data = _data;
643
756
  this._dialogRef = _dialogRef;
644
757
  this._message = _message;
645
758
  this._dialog = _dialog;
646
759
  this._cdRef = _cdRef;
760
+ this._prompt = _prompt;
761
+ this.focused = null;
647
762
  this.resizing = false;
648
- this.editors = {
649
- html: true,
650
- scss: true,
651
- js: false,
652
- globalScss: false,
653
- };
763
+ this.editors = (_a = {},
764
+ _a[EditorType.Html] = true,
765
+ _a[EditorType.Scss] = true,
766
+ _a[EditorType.Js] = false,
767
+ _a[EditorType.GlobalScss] = false,
768
+ _a);
654
769
  this._destroy$ = new rxjs.Subject();
770
+ this.save = function () {
771
+ return rxjs.of(null)
772
+ .pipe(operators.filter(function () { return _this.focused; }), operators.switchMap(function () {
773
+ switch (_this.focused) {
774
+ case EditorType.Js:
775
+ case EditorType.Html:
776
+ case EditorType.Scss:
777
+ return _this.saveContentPage();
778
+ case EditorType.GlobalScss:
779
+ return _this.editor.saveGlobalScss();
780
+ }
781
+ return rxjs.throwError('Invalid focus');
782
+ }), operators.tap(function () {
783
+ _this.editor.clearChange(_this.focused);
784
+ _this._cdRef.markForCheck();
785
+ }));
786
+ };
655
787
  }
656
788
  ContentPageEditorComponent.prototype.ngOnInit = function () {
657
789
  this._dialogRef.addPanelClass('fs-content-editor-overlay-pane');
790
+ this._dialogRef.disableClose = true;
658
791
  this.config = this._data.contentConfig;
659
792
  this._initContentPage(this._data.contentPage);
660
793
  };
@@ -673,28 +806,55 @@
673
806
  _this._cdRef.markForCheck();
674
807
  });
675
808
  };
676
- ContentPageEditorComponent.prototype.editorChanged = function (event) {
677
- var data = {};
678
- if (event.type === 'js') {
679
- data.js = event.value;
680
- }
681
- if (event.type === 'html') {
682
- data.content = event.value;
683
- }
684
- if (event.type === 'scss') {
685
- data.styles = event.value;
686
- }
687
- this.saveContentPage(data);
809
+ ContentPageEditorComponent.prototype.editorFocused = function (type) {
810
+ this.focused = type;
688
811
  };
689
- ContentPageEditorComponent.prototype.saveContentPage = function (data) {
812
+ ContentPageEditorComponent.prototype.saveContentPage = function () {
813
+ var _a, _b;
690
814
  var _this = this;
691
- this.config.saveContentPage(Object.assign({ id: this.contentPage.id }, data))
692
- .pipe(operators.tap(function (contentPage) {
693
- _this.contentPage = Object.assign(Object.assign({}, _this.contentPage), contentPage);
694
- _this._cdRef.markForCheck();
815
+ var names = (_a = {},
816
+ _a[EditorType.Js] = 'js',
817
+ _a[EditorType.Scss] = 'styles',
818
+ _a[EditorType.Html] = 'content',
819
+ _a);
820
+ var data = (_b = {
821
+ id: this.contentPage.id
822
+ },
823
+ _b[names[this.focused]] = this.editor.changes[this.focused],
824
+ _b);
825
+ return this.config.saveContentPage(Object.assign({ id: this.contentPage.id }, data))
826
+ .pipe(operators.tap(function () {
695
827
  _this._message.success('Saved Changes');
696
- }))
697
- .subscribe();
828
+ }));
829
+ };
830
+ ContentPageEditorComponent.prototype.cancel = function () {
831
+ var _this = this;
832
+ if (!this.editor.hasChanges) {
833
+ return this._dialogRef.close();
834
+ }
835
+ this._prompt.confirm({
836
+ dialogConfig: {
837
+ width: null,
838
+ },
839
+ title: 'You have unsaved changes',
840
+ template: 'What would you like to do with your changes?',
841
+ buttons: [
842
+ {
843
+ label: 'Review Changes',
844
+ value: 'review',
845
+ },
846
+ {
847
+ label: 'Discard Changes',
848
+ value: 'discard',
849
+ },
850
+ ],
851
+ })
852
+ .pipe(operators.takeUntil(this._destroy$))
853
+ .subscribe(function (value) {
854
+ if (value === 'discard') {
855
+ _this._dialogRef.close();
856
+ }
857
+ });
698
858
  };
699
859
  ContentPageEditorComponent.prototype.openSettings = function () {
700
860
  var _this = this;
@@ -712,8 +872,8 @@
712
872
  };
713
873
  return ContentPageEditorComponent;
714
874
  }());
715
- ContentPageEditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageEditorComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i2__namespace.FsMessage }, { token: i1__namespace.MatDialog }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
716
- ContentPageEditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentPageEditorComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog *fsSkeletonForm=\"contentPage\">\n <h1 mat-dialog-title>\n <div class=\"title-container\">\n <div class=\"title\">\n Page Editor\n <div class=\"small\">{{contentPage.name}}</div> \n </div>\n <a\n (click)=\"openSettings()\"\n mat-icon-button>\n <mat-icon>settings</mat-icon>\n </a> \n </div>\n </h1>\n <div mat-dialog-content>\n <app-editor\n [contentConfig]=\"config\"\n [showHtml]=\"editors.html\"\n [showJs]=\"editors.js\"\n [showScss]=\"editors.scss\"\n [showGlobalScss]=\"editors.globalScss\"\n [html]=\"contentPage.content\"\n [scss]=\"contentPage.styles\"\n [js]=\"contentPage.js\"\n (changed)=\"editorChanged($event)\">\n </app-editor>\n </div>\n\n <div mat-dialog-actions>\n <fs-form-dialog-actions\n [save]=\"false\"\n [done]=\"true\">\n </fs-form-dialog-actions>\n <div class=\"toggles\">\n <mat-button-toggle-group multiple>\n <mat-button-toggle value=\"html\" [checked]=\"editors.html\" (change)=\"editorToggleChange($event)\">HTML</mat-button-toggle>\n <mat-button-toggle value=\"scss\" [checked]=\"editors.scss\" (change)=\"editorToggleChange($event)\">SCSS</mat-button-toggle>\n <mat-button-toggle value=\"js\" [checked]=\"editors.js\" (change)=\"editorToggleChange($event)\">JS</mat-button-toggle>\n <mat-button-toggle value=\"globalScss\" [checked]=\"editors.globalScss\" (change)=\"editorToggleChange($event)\">Global SCSS</mat-button-toggle>\n </mat-button-toggle-group> \n </div>\n </div>\n</fs-dialog>\n\n", styles: ["::ng-deep .fs-content-editor-overlay-pane .mat-dialog-container{border-radius:0}fs-dialog{display:flex;height:100%;flex-direction:column}fs-dialog ::ng-deep .mat-dialog-content{max-height:none;flex:1;overflow:hidden}.mat-dialog-actions fs-form-dialog-actions{width:auto}.mat-dialog-actions .toggles{display:flex;justify-content:flex-end;justify-self:baseline;flex:1}.title-container{display:flex;align-items:center}.title-container .title{flex:1}.title-container .title .small{line-height:normal}\n"], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace$2.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab], a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i5__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: EditorComponent, selector: "app-editor", inputs: ["showHtml", "showScss", "showJs", "showGlobalScss", "html", "scss", "js", "contentConfig"], outputs: ["changed"] }, { type: i7__namespace$1.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }, { type: i8__namespace$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-labelledby", "tabIndex", "appearance", "checked", "disabled", "id", "name", "aria-label", "value"], outputs: ["change"], exportAs: ["matButtonToggle"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i8__namespace$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
875
+ ContentPageEditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageEditorComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i2__namespace.FsMessage }, { token: i1__namespace.MatDialog }, { token: i0__namespace.ChangeDetectorRef }, { token: i3__namespace$2.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
876
+ ContentPageEditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentPageEditorComponent, selector: "ng-component", viewQueries: [{ propertyName: "editor", first: true, predicate: EditorComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\" [dirtySubmitButton]=\"false\" [confirm]=\"false\">\n <fs-dialog *fsSkeletonForm=\"contentPage\">\n <h1 mat-dialog-title>\n <div class=\"title-container\">\n <div class=\"title\">\n Page Editor\n <div class=\"small\">{{contentPage.name}}</div> \n </div>\n <a\n (click)=\"openSettings()\"\n mat-icon-button>\n <mat-icon>settings</mat-icon>\n </a> \n </div>\n </h1>\n <div mat-dialog-content>\n <app-editor\n [contentConfig]=\"config\"\n [showHtml]=\"editors.html\"\n [showJs]=\"editors.js\"\n [showScss]=\"editors.scss\"\n [showGlobalScss]=\"editors.globalScss\"\n [html]=\"contentPage.content\"\n [scss]=\"contentPage.styles\"\n [js]=\"contentPage.js\"\n (focused)=\"editorFocused($event)\">\n </app-editor>\n </div>\n\n <div mat-dialog-actions>\n <button \n mat-button\n color=\"primary\"\n (click)=\"cancel()\"\n type=\"button\"> \n Done \n </button>\n \n <div class=\"toggles\">\n <mat-button-toggle-group multiple>\n <mat-button-toggle value=\"html\" [checked]=\"editors.html\" (change)=\"editorToggleChange($event)\">HTML</mat-button-toggle>\n <mat-button-toggle value=\"scss\" [checked]=\"editors.scss\" (change)=\"editorToggleChange($event)\">SCSS</mat-button-toggle>\n <mat-button-toggle value=\"js\" [checked]=\"editors.js\" (change)=\"editorToggleChange($event)\">JS</mat-button-toggle>\n <mat-button-toggle value=\"globalScss\" [checked]=\"editors.globalScss\" (change)=\"editorToggleChange($event)\">Global SCSS</mat-button-toggle>\n </mat-button-toggle-group> \n </div>\n </div>\n</fs-dialog>\n</form>", styles: ["::ng-deep .fs-content-editor-overlay-pane .mat-dialog-container{border-radius:0}form{height:100%}fs-dialog{display:flex;height:100%;flex-direction:column}fs-dialog ::ng-deep .mat-dialog-content{max-height:none;flex:1;overflow:hidden}.mat-dialog-actions fs-form-dialog-actions{width:auto}.mat-dialog-actions .toggles{display:flex;justify-content:flex-end;justify-self:baseline;flex:1}.title-container{display:flex;align-items:center}.title-container .title{flex:1}.title-container .title .small{line-height:normal}\n"], components: [{ type: i3__namespace$1.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i5__namespace$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab], a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i6__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: EditorComponent, selector: "app-editor", inputs: ["showHtml", "showScss", "showJs", "showGlobalScss", "html", "scss", "js", "contentConfig"], outputs: ["changed", "focused", "blured"] }, { type: i5__namespace$1.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"] }, { type: i8__namespace$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-labelledby", "tabIndex", "appearance", "checked", "disabled", "id", "name", "aria-label", "value"], outputs: ["change"], exportAs: ["matButtonToggle"] }], directives: [{ type: i9__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i9__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i9__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5__namespace.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"] }, { type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i5__namespace.FsButtonDirective, selector: "[mat-raised-button],[mat-button],[mat-flat-button],[mat-stroked-button]", inputs: ["name", "dirtySubmit", "form"] }, { type: i8__namespace$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
717
877
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageEditorComponent, decorators: [{
718
878
  type: i0.Component,
719
879
  args: [{
@@ -725,14 +885,17 @@
725
885
  return [{ type: undefined, decorators: [{
726
886
  type: i0.Inject,
727
887
  args: [i1.MAT_DIALOG_DATA]
728
- }] }, { type: i1__namespace.MatDialogRef }, { type: i2__namespace.FsMessage }, { type: i1__namespace.MatDialog }, { type: i0__namespace.ChangeDetectorRef }];
729
- } });
888
+ }] }, { type: i1__namespace.MatDialogRef }, { type: i2__namespace.FsMessage }, { type: i1__namespace.MatDialog }, { type: i0__namespace.ChangeDetectorRef }, { type: i3__namespace$2.FsPrompt }];
889
+ }, propDecorators: { editor: [{
890
+ type: i0.ViewChild,
891
+ args: [EditorComponent]
892
+ }] } });
730
893
 
731
894
  var FsContentPagesComponent = /** @class */ (function () {
732
895
  function FsContentPagesComponent(_config, _dialog) {
733
896
  this._config = _config;
734
897
  this._dialog = _dialog;
735
- this.pageTypes = i7$2.index(PageTypes, 'value', 'name');
898
+ this.pageTypes = i7.index(PageTypes, 'value', 'name');
736
899
  this._destroy$ = new rxjs.Subject();
737
900
  }
738
901
  FsContentPagesComponent.prototype.ngOnInit = function () {
@@ -752,7 +915,7 @@
752
915
  autoFocus: false,
753
916
  })
754
917
  .afterClosed()
755
- .pipe(operators.filter(function (_contentPage) { return !!_contentPage; }), operators.takeUntil(this._destroy$))
918
+ .pipe(operators.takeUntil(this._destroy$))
756
919
  .subscribe(function () {
757
920
  _this.listComponent.reload();
758
921
  });
@@ -826,7 +989,7 @@
826
989
  return FsContentPagesComponent;
827
990
  }());
828
991
  FsContentPagesComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentPagesComponent, deps: [{ token: FS_CONTENT_CONFIG }, { token: i1__namespace.MatDialog }], target: i0__namespace.ɵɵFactoryTarget.Component });
829
- FsContentPagesComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsContentPagesComponent, selector: "fs-content-pages", inputs: { htmlEditorConfig: "htmlEditorConfig" }, viewQueries: [{ propertyName: "listComponent", first: true, predicate: i2$2.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\">\n <fs-list-column name=\"name\" title=\"Name\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openEditor(row)\">{{row.name}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"path\" title=\"Path\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a [href]=\"'/' + row.path\" target=\"_black\">/{{row.path}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"type\" title=\"Type\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{pageTypes[row.type]}}\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"modify_date\" title=\"Modified\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.modifyDate | fsDate: 'date-time-yearless'}}\n </ng-template>\n </fs-list-column>\n</fs-list>\n", styles: [":host ::ng-deep .modified,:host ::ng-deep .name{width:1%;white-space:nowrap}:host ::ng-deep .preview-content img{display:none}.preview-content{position:relative;max-height:100px;max-width:100%;overflow:hidden;-webkit-mask-image:-webkit-gradient(linear,left 60%,left bottom,from(black),to(rgba(0,0,0,0)))}\n"], components: [{ type: i2__namespace$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2__namespace$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i3__namespace$2.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
992
+ FsContentPagesComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsContentPagesComponent, selector: "fs-content-pages", inputs: { htmlEditorConfig: "htmlEditorConfig" }, viewQueries: [{ propertyName: "listComponent", first: true, predicate: i2$2.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\">\n <fs-list-column name=\"name\" title=\"Name\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openEditor(row)\">{{row.name}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"path\" title=\"Path\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a [href]=\"'/' + row.path\" target=\"_black\">/{{row.path}}</a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"type\" title=\"Type\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{pageTypes[row.type]}}\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"modify_date\" title=\"Modified\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n {{row.modifyDate | fsDate: 'date-time-yearless'}}\n </ng-template>\n </fs-list-column>\n</fs-list>\n", styles: [":host ::ng-deep .modified,:host ::ng-deep .name{width:1%;white-space:nowrap}:host ::ng-deep .preview-content img{display:none}.preview-content{position:relative;max-height:100px;max-width:100%;overflow:hidden;-webkit-mask-image:-webkit-gradient(linear,left 60%,left bottom,from(black),to(rgba(0,0,0,0)))}\n"], components: [{ type: i2__namespace$2.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2__namespace$2.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$2.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i3__namespace$3.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
830
993
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentPagesComponent, decorators: [{
831
994
  type: i0.Component,
832
995
  args: [{
@@ -861,19 +1024,19 @@
861
1024
  FsContentPagesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentPagesModule, declarations: [FsContentPagesComponent,
862
1025
  ContentPageComponent,
863
1026
  ContentPageEditorComponent], imports: [i10.CommonModule,
864
- i7.FormsModule,
1027
+ i9.FormsModule,
865
1028
  i1.MatDialogModule,
866
1029
  i8$2.MatInputModule,
867
- i4$2.MatFormFieldModule,
868
- i4$1.MatButtonModule,
1030
+ i4$1.MatFormFieldModule,
1031
+ i5$1.MatButtonModule,
869
1032
  tabs.MatTabsModule,
870
- i5.MatIconModule,
871
- i5$1.MatSelectModule,
1033
+ i6.MatIconModule,
1034
+ i5$2.MatSelectModule,
872
1035
  i8$1.MatButtonToggleModule,
873
1036
  i2$2.FsListModule,
874
- i3$2.FsDateModule,
875
- i7$2.FsCommonModule,
876
- i7$1.FsFormModule,
1037
+ i3$3.FsDateModule,
1038
+ i7.FsCommonModule,
1039
+ i5.FsFormModule,
877
1040
  i3.FsLabelModule,
878
1041
  i8.FsSkeletonModule,
879
1042
  htmlEditor.FsHtmlEditorModule,
@@ -882,19 +1045,19 @@
882
1045
  FsContentEditorModule], exports: [FsContentPagesComponent] });
883
1046
  FsContentPagesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentPagesModule, imports: [[
884
1047
  i10.CommonModule,
885
- i7.FormsModule,
1048
+ i9.FormsModule,
886
1049
  i1.MatDialogModule,
887
1050
  i8$2.MatInputModule,
888
- i4$2.MatFormFieldModule,
889
- i4$1.MatButtonModule,
1051
+ i4$1.MatFormFieldModule,
1052
+ i5$1.MatButtonModule,
890
1053
  tabs.MatTabsModule,
891
- i5.MatIconModule,
892
- i5$1.MatSelectModule,
1054
+ i6.MatIconModule,
1055
+ i5$2.MatSelectModule,
893
1056
  i8$1.MatButtonToggleModule,
894
1057
  i2$2.FsListModule,
895
- i3$2.FsDateModule,
896
- i7$2.FsCommonModule,
897
- i7$1.FsFormModule,
1058
+ i3$3.FsDateModule,
1059
+ i7.FsCommonModule,
1060
+ i5.FsFormModule,
898
1061
  i3.FsLabelModule,
899
1062
  i8.FsSkeletonModule,
900
1063
  htmlEditor.FsHtmlEditorModule,
@@ -907,19 +1070,19 @@
907
1070
  args: [{
908
1071
  imports: [
909
1072
  i10.CommonModule,
910
- i7.FormsModule,
1073
+ i9.FormsModule,
911
1074
  i1.MatDialogModule,
912
1075
  i8$2.MatInputModule,
913
- i4$2.MatFormFieldModule,
914
- i4$1.MatButtonModule,
1076
+ i4$1.MatFormFieldModule,
1077
+ i5$1.MatButtonModule,
915
1078
  tabs.MatTabsModule,
916
- i5.MatIconModule,
917
- i5$1.MatSelectModule,
1079
+ i6.MatIconModule,
1080
+ i5$2.MatSelectModule,
918
1081
  i8$1.MatButtonToggleModule,
919
1082
  i2$2.FsListModule,
920
- i3$2.FsDateModule,
921
- i7$2.FsCommonModule,
922
- i7$1.FsFormModule,
1083
+ i3$3.FsDateModule,
1084
+ i7.FsCommonModule,
1085
+ i5.FsFormModule,
923
1086
  i3.FsLabelModule,
924
1087
  i8.FsSkeletonModule,
925
1088
  htmlEditor.FsHtmlEditorModule,
@@ -977,7 +1140,7 @@
977
1140
  return ContentStyleComponent;
978
1141
  }());
979
1142
  ContentStyleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentStyleComponent, deps: [{ token: FS_CONTENT_CONFIG }, { token: i2__namespace.FsMessage }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
980
- ContentStyleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentStyleComponent, selector: "fs-content-style", inputs: { height: "height" }, viewQueries: [{ propertyName: "textEditors", first: true, predicate: i4.FsTextEditorComponent, descendants: true }, { propertyName: "form", first: true, predicate: i7$1.FsFormDirective, descendants: true }], ngImport: i0__namespace, template: "<ng-container *fsSkeletonForm=\"contentStyle\">\n <fs-text-editor \n [(ngModel)]=\"contentStyle.scss\" \n name=\"contentStyle\"\n [fsModelChangeOptions]=\"{ debounce: 300 }\"\n (fsModelChange)=\"save()\"\n [config]=\"styleConfig\">\n </fs-text-editor> \n</ng-container>\n", styles: [""], components: [{ type: i4__namespace.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["ready", "blur"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i7__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7__namespace$2.FsModelChangeDirective, selector: "[fsModelChange]", inputs: ["fsModelChangeOptions"], outputs: ["fsModelChange"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
1143
+ ContentStyleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentStyleComponent, selector: "fs-content-style", inputs: { height: "height" }, viewQueries: [{ propertyName: "textEditors", first: true, predicate: i4.FsTextEditorComponent, descendants: true }, { propertyName: "form", first: true, predicate: i5.FsFormDirective, descendants: true }], ngImport: i0__namespace, template: "<ng-container *fsSkeletonForm=\"contentStyle\">\n <fs-text-editor \n [(ngModel)]=\"contentStyle.scss\" \n name=\"contentStyle\"\n [fsModelChangeOptions]=\"{ debounce: 300 }\"\n (fsModelChange)=\"save()\"\n [config]=\"styleConfig\">\n </fs-text-editor> \n</ng-container>\n", styles: [""], components: [{ type: i4__namespace.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["ready", "blur"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i9__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i9__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7__namespace.FsModelChangeDirective, selector: "[fsModelChange]", inputs: ["fsModelChangeOptions"], outputs: ["fsModelChange"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
981
1144
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentStyleComponent, decorators: [{
982
1145
  type: i0.Component,
983
1146
  args: [{
@@ -996,7 +1159,7 @@
996
1159
  args: [i4.FsTextEditorComponent]
997
1160
  }], form: [{
998
1161
  type: i0.ViewChild,
999
- args: [i7$1.FsFormDirective]
1162
+ args: [i5.FsFormDirective]
1000
1163
  }], height: [{
1001
1164
  type: i0.Input
1002
1165
  }] } });
@@ -1008,19 +1171,19 @@
1008
1171
  }());
1009
1172
  FsContentStyleModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentStyleModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1010
1173
  FsContentStyleModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentStyleModule, declarations: [ContentStyleComponent], imports: [i10.CommonModule,
1011
- i7.FormsModule,
1012
- i4$1.MatButtonModule,
1174
+ i9.FormsModule,
1175
+ i5$1.MatButtonModule,
1013
1176
  i4.FsTextEditorModule,
1014
1177
  i8.FsSkeletonModule,
1015
- i7$2.FsCommonModule,
1178
+ i7.FsCommonModule,
1016
1179
  FsContentEditorModule], exports: [ContentStyleComponent] });
1017
1180
  FsContentStyleModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentStyleModule, imports: [[
1018
1181
  i10.CommonModule,
1019
- i7.FormsModule,
1020
- i4$1.MatButtonModule,
1182
+ i9.FormsModule,
1183
+ i5$1.MatButtonModule,
1021
1184
  i4.FsTextEditorModule,
1022
1185
  i8.FsSkeletonModule,
1023
- i7$2.FsCommonModule,
1186
+ i7.FsCommonModule,
1024
1187
  FsContentEditorModule,
1025
1188
  ]] });
1026
1189
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentStyleModule, decorators: [{
@@ -1028,11 +1191,11 @@
1028
1191
  args: [{
1029
1192
  imports: [
1030
1193
  i10.CommonModule,
1031
- i7.FormsModule,
1032
- i4$1.MatButtonModule,
1194
+ i9.FormsModule,
1195
+ i5$1.MatButtonModule,
1033
1196
  i4.FsTextEditorModule,
1034
1197
  i8.FsSkeletonModule,
1035
- i7$2.FsCommonModule,
1198
+ i7.FsCommonModule,
1036
1199
  FsContentEditorModule,
1037
1200
  ],
1038
1201
  exports: [
@@ -1100,7 +1263,7 @@
1100
1263
  };
1101
1264
  return ContentRendererComponent;
1102
1265
  }());
1103
- ContentRendererComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentRendererComponent, deps: [{ token: i1__namespace$1.DomSanitizer }, { token: i2__namespace$3.Router }, { token: i0__namespace.ElementRef }, { token: i3__namespace$3.HtmlRenderer }], target: i0__namespace.ɵɵFactoryTarget.Component });
1266
+ ContentRendererComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentRendererComponent, deps: [{ token: i1__namespace$1.DomSanitizer }, { token: i2__namespace$3.Router }, { token: i0__namespace.ElementRef }, { token: i3__namespace$4.HtmlRenderer }], target: i0__namespace.ɵɵFactoryTarget.Component });
1104
1267
  ContentRendererComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentRendererComponent, selector: "fs-content-renderer", inputs: { contentPage: "contentPage" }, viewQueries: [{ propertyName: "script", first: true, predicate: ["script"], descendants: true, read: i0.ElementRef }], ngImport: i0__namespace, template: "<div *ngIf=\"content\" [innerHTML]=\"content\"></div>\n<span #script></span>", styles: [""], directives: [{ type: i10__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
1105
1268
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentRendererComponent, decorators: [{
1106
1269
  type: i0.Component,
@@ -1110,7 +1273,7 @@
1110
1273
  styleUrls: ['./content-renderer.component.scss'],
1111
1274
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
1112
1275
  }]
1113
- }], ctorParameters: function () { return [{ type: i1__namespace$1.DomSanitizer }, { type: i2__namespace$3.Router }, { type: i0__namespace.ElementRef }, { type: i3__namespace$3.HtmlRenderer }]; }, propDecorators: { script: [{
1276
+ }], ctorParameters: function () { return [{ type: i1__namespace$1.DomSanitizer }, { type: i2__namespace$3.Router }, { type: i0__namespace.ElementRef }, { type: i3__namespace$4.HtmlRenderer }]; }, propDecorators: { script: [{
1114
1277
  type: i0.ViewChild,
1115
1278
  args: ['script', { read: i0.ElementRef }]
1116
1279
  }], contentPage: [{
@@ -1182,7 +1345,7 @@
1182
1345
  };
1183
1346
  return FsContentComponent;
1184
1347
  }());
1185
- FsContentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentComponent, deps: [{ token: FS_CONTENT_CONFIG }, { token: i1__namespace$1.Title }, { token: i0__namespace.ChangeDetectorRef }, { token: i2__namespace$3.Router }, { token: i0__namespace.ElementRef }, { token: i3__namespace$3.HtmlRenderer }], target: i0__namespace.ɵɵFactoryTarget.Component });
1348
+ FsContentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentComponent, deps: [{ token: FS_CONTENT_CONFIG }, { token: i1__namespace$1.Title }, { token: i0__namespace.ChangeDetectorRef }, { token: i2__namespace$3.Router }, { token: i0__namespace.ElementRef }, { token: i3__namespace$4.HtmlRenderer }], target: i0__namespace.ɵɵFactoryTarget.Component });
1186
1349
  FsContentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsContentComponent, selector: "fs-content", ngImport: i0__namespace, template: "<ng-container *ngIf=\"contentPage\">\n <fs-content-renderer [contentPage]=\"contentPage\"></fs-content-renderer>\n</ng-container>", styles: [""], components: [{ type: ContentRendererComponent, selector: "fs-content-renderer", inputs: ["contentPage"] }], directives: [{ type: i10__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
1187
1350
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentComponent, decorators: [{
1188
1351
  type: i0.Component,
@@ -1196,7 +1359,7 @@
1196
1359
  return [{ type: undefined, decorators: [{
1197
1360
  type: i0.Inject,
1198
1361
  args: [FS_CONTENT_CONFIG]
1199
- }] }, { type: i1__namespace$1.Title }, { type: i0__namespace.ChangeDetectorRef }, { type: i2__namespace$3.Router }, { type: i0__namespace.ElementRef }, { type: i3__namespace$3.HtmlRenderer }];
1362
+ }] }, { type: i1__namespace$1.Title }, { type: i0__namespace.ChangeDetectorRef }, { type: i2__namespace$3.Router }, { type: i0__namespace.ElementRef }, { type: i3__namespace$4.HtmlRenderer }];
1200
1363
  } });
1201
1364
 
1202
1365
  var FsContentModule = /** @class */ (function () {