@firestitch/content 12.1.0 → 12.2.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -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('rxjs'), require('rxjs/operators'), require('@firestitch/message'), require('@angular/material/core'), require('@firestitch/filter'), require('@firestitch/common'), require('@angular/router'), require('@angular/platform-browser')) :
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', 'rxjs', 'rxjs/operators', '@firestitch/message', '@angular/material/core', '@firestitch/filter', '@firestitch/common', '@angular/router', '@angular/platform-browser'], 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.i4$2, global.i3, global.i7, global.htmlEditor, global.i5, global.i2$1, global.i8, global.i6, global.rxjs, global.rxjs.operators, global.i2, global.ng.material.core, global.filter, global.common, global.ng.router, global.ng.platformBrowser));
5
- })(this, (function (exports, i10, i0, i9, button, i4, i1, i4$1, i3$1, i11, i5$1, tabs, i4$2, i3, i7, htmlEditor, i5, i2$1, i8, i6, rxjs, operators, i2, i6$1, filter, common, i2$2, i1$1) { '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('rxjs'), require('rxjs/operators'), require('@firestitch/message'), require('@angular/material/core'), require('@firestitch/common'), require('@firestitch/filter'), require('@angular/router'), require('@angular/platform-browser')) :
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', 'rxjs', 'rxjs/operators', '@firestitch/message', '@angular/material/core', '@firestitch/common', '@firestitch/filter', '@angular/router', '@angular/platform-browser'], 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$1, global.i3, global.i7$1, global.htmlEditor, global.i6$1, global.i2$1, global.i8, global.i7, global.rxjs, global.rxjs.operators, global.i2, global.ng.material.core, global.common, global.filter, global.ng.router, global.ng.platformBrowser));
5
+ })(this, (function (exports, i10, i0, i9, i4$1, i9$1, i1, i4, i5$1, i11, i5, tabs, i3$1, i3, i7$1, htmlEditor, i6$1, i2$1, i8, i7, rxjs, operators, i2, i6, common, filter, i2$2, i1$1) { 'use strict';
6
6
 
7
7
  function _interopNamespace(e) {
8
8
  if (e && e.__esModule) return e;
@@ -25,141 +25,25 @@
25
25
  var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
26
26
  var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
27
27
  var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
28
- var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
29
- var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
30
28
  var i4__namespace$1 = /*#__PURE__*/_interopNamespace(i4$1);
31
- var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
32
- var i11__namespace = /*#__PURE__*/_interopNamespace(i11);
29
+ var i9__namespace$1 = /*#__PURE__*/_interopNamespace(i9$1);
30
+ var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
31
+ var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
33
32
  var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
34
- var i4__namespace$2 = /*#__PURE__*/_interopNamespace(i4$2);
35
- var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
36
- var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
33
+ var i11__namespace = /*#__PURE__*/_interopNamespace(i11);
37
34
  var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
35
+ var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
36
+ var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
37
+ var i7__namespace = /*#__PURE__*/_interopNamespace(i7$1);
38
+ var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
38
39
  var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
39
40
  var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
40
- var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
41
+ var i7__namespace$1 = /*#__PURE__*/_interopNamespace(i7);
41
42
  var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
42
- var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
43
+ var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
43
44
  var i2__namespace$2 = /*#__PURE__*/_interopNamespace(i2$2);
44
45
  var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
45
46
 
46
- var EditorComponent = /** @class */ (function () {
47
- function EditorComponent(_data, _dialogRef, _message) {
48
- var _this = this;
49
- this._data = _data;
50
- this._dialogRef = _dialogRef;
51
- this._message = _message;
52
- this.styles = null;
53
- this.content = null;
54
- this.editors = { content: true, styles: true };
55
- this._destroy$ = new rxjs.Subject();
56
- this.save = function () {
57
- return _this._data.save({ content: _this.content, styles: _this.styles })
58
- .pipe(operators.tap(function () {
59
- _this._message.success('Saved Changes');
60
- }));
61
- };
62
- }
63
- EditorComponent.prototype.ngOnInit = function () {
64
- this._dialogRef.updateSize('100%', '100%');
65
- this.content = this._data.content;
66
- this.styles = this._data.styles;
67
- };
68
- EditorComponent.prototype.editorToggleChange = function (event) {
69
- var _this = this;
70
- this.editors[event.value] = !this.editors[event.value];
71
- setTimeout(function () {
72
- _this.textEditors.forEach(function (textEditor) {
73
- textEditor.updateLayout();
74
- });
75
- }, 100);
76
- };
77
- EditorComponent.prototype.ngOnDestroy = function () {
78
- this._destroy$.next();
79
- this._destroy$.complete();
80
- };
81
- return EditorComponent;
82
- }());
83
- EditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: EditorComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i2__namespace.FsMessage }], target: i0__namespace.ɵɵFactoryTarget.Component });
84
- EditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: EditorComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i6.FsTextEditorComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\">\n <fs-dialog>\n <h1 mat-dialog-title>Design</h1>\n <div mat-dialog-content>\n <div class=\"container\">\n <div class=\"toggles\">\n <mat-button-toggle-group multiple>\n <mat-button-toggle value=\"content\" [checked]=\"editors.content\" (change)=\"editorToggleChange($event)\">Content</mat-button-toggle>\n <mat-button-toggle value=\"styles\" [checked]=\"editors.styles\" (change)=\"editorToggleChange($event)\">Styles</mat-button-toggle>\n </mat-button-toggle-group> \n </div>\n <div class=\"editors\">\n <div class=\"editor\" *ngIf=\"editors.content\">\n <fs-label>Content</fs-label>\n <div class=\"editor-container\">\n <fs-text-editor \n [(ngModel)]=\"content\" \n name=\"content\"\n [config]=\"{ tabSize: 2, language: 'html' }\">\n </fs-text-editor> \n </div>\n </div>\n <div class=\"editor\" *ngIf=\"editors.styles\">\n <fs-label>Styles</fs-label>\n <div class=\"editor-container\">\n <fs-text-editor \n [(ngModel)]=\"styles\" \n name=\"styles\"\n [config]=\"{ tabSize: 2, language: 'scss' }\">\n </fs-text-editor> \n </div>\n </div> \n </div>\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: ["form{display:block;height:100%}form fs-dialog{display:flex;flex-direction:column;height:100%}form ::ng-deep .mat-dialog-content{max-height:none;flex:1}.toggles{display:flex;align-self:end;z-index:1;position:relative;margin-bottom:-12px}.container{height:100%;display:flex;flex-direction:column}.editors{width:5000px;max-width:100%;height:100%;display:flex;min-height:0}.editors .editor{height:100%;display:flex;min-width:0;width:100%;flex-direction:column}.editors .editor .editor-container{height:100%;overflow:auto;background:#1E1E1E}.editors .editor .editor-container fs-text-editor{display:block}.editors .editor+.editor{margin-left:20px}.editors .editor fs-label{background-color:#fff;padding-bottom:5px}\n"], components: [{ type: i3__namespace.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-labelledby", "tabIndex", "appearance", "checked", "disabled", "id", "name", "aria-label", "value"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { type: i5__namespace.FsLabelComponent, selector: "fs-label" }, { type: i6__namespace.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["init", "blur"] }, { type: i7__namespace.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }], 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: i7__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"] }, { 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: i4__namespace.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { type: i10__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.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 });
85
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: EditorComponent, decorators: [{
86
- type: i0.Component,
87
- args: [{
88
- templateUrl: './editor.component.html',
89
- styleUrls: ['./editor.component.scss'],
90
- changeDetection: i0.ChangeDetectionStrategy.OnPush,
91
- }]
92
- }], ctorParameters: function () {
93
- return [{ type: undefined, decorators: [{
94
- type: i0.Inject,
95
- args: [i1.MAT_DIALOG_DATA]
96
- }] }, { type: i1__namespace.MatDialogRef }, { type: i2__namespace.FsMessage }];
97
- }, propDecorators: { textEditors: [{
98
- type: i0.ViewChildren,
99
- args: [i6.FsTextEditorComponent]
100
- }] } });
101
-
102
- var FsContentEditorModule = /** @class */ (function () {
103
- function FsContentEditorModule() {
104
- }
105
- return FsContentEditorModule;
106
- }());
107
- FsContentEditorModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
108
- FsContentEditorModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, declarations: [EditorComponent], imports: [i10.CommonModule,
109
- i9.FormsModule,
110
- i1.MatDialogModule,
111
- button.MatButtonModule,
112
- tabs.MatTabsModule,
113
- i3$1.MatIconModule,
114
- i4.MatButtonToggleModule,
115
- i2$1.FsListModule,
116
- i7.FsFormModule,
117
- i5.FsLabelModule,
118
- htmlEditor.FsHtmlEditorModule,
119
- i3.FsDialogModule,
120
- i6.FsTextEditorModule], exports: [EditorComponent] });
121
- FsContentEditorModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, imports: [[
122
- i10.CommonModule,
123
- i9.FormsModule,
124
- i1.MatDialogModule,
125
- button.MatButtonModule,
126
- tabs.MatTabsModule,
127
- i3$1.MatIconModule,
128
- i4.MatButtonToggleModule,
129
- i2$1.FsListModule,
130
- i7.FsFormModule,
131
- i5.FsLabelModule,
132
- htmlEditor.FsHtmlEditorModule,
133
- i3.FsDialogModule,
134
- i6.FsTextEditorModule,
135
- ]] });
136
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, decorators: [{
137
- type: i0.NgModule,
138
- args: [{
139
- imports: [
140
- i10.CommonModule,
141
- i9.FormsModule,
142
- i1.MatDialogModule,
143
- button.MatButtonModule,
144
- tabs.MatTabsModule,
145
- i3$1.MatIconModule,
146
- i4.MatButtonToggleModule,
147
- i2$1.FsListModule,
148
- i7.FsFormModule,
149
- i5.FsLabelModule,
150
- htmlEditor.FsHtmlEditorModule,
151
- i3.FsDialogModule,
152
- i6.FsTextEditorModule,
153
- ],
154
- exports: [
155
- EditorComponent,
156
- ],
157
- declarations: [
158
- EditorComponent,
159
- ],
160
- }]
161
- }] });
162
-
163
47
  var PageType;
164
48
  (function (PageType) {
165
49
  PageType["StandardPage"] = "standardPage";
@@ -198,6 +82,7 @@
198
82
  };
199
83
  }
200
84
  ContentPageComponent.prototype.ngOnInit = function () {
85
+ this._dialogRef.updateSize('600px');
201
86
  this._fetchData();
202
87
  };
203
88
  ContentPageComponent.prototype.ngOnDestroy = function () {
@@ -223,7 +108,7 @@
223
108
  return ContentPageComponent;
224
109
  }());
225
110
  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 });
226
- ContentPageComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentPageComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i6.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>\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 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 <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 </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.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$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i7__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: i7__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"] }, { 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: i7__namespace.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i10__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11__namespace.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: i7__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: i10__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
111
+ ContentPageComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentPageComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i7.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.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i5__namespace.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6__namespace.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i7__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: i7__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: i7__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: i11__namespace.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: i7__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 });
227
112
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageComponent, decorators: [{
228
113
  type: i0.Component,
229
114
  args: [{
@@ -241,44 +126,233 @@
241
126
  }] }, { type: i1__namespace.MatDialogRef }, { type: i2__namespace.FsMessage }, { type: i0__namespace.ChangeDetectorRef }];
242
127
  }, propDecorators: { textEditors: [{
243
128
  type: i0.ViewChildren,
244
- args: [i6.FsTextEditorComponent]
129
+ args: [i7.FsTextEditorComponent]
245
130
  }] } });
246
131
 
247
- var FsContentPagesComponent = /** @class */ (function () {
248
- function FsContentPagesComponent(_config, _dialog) {
249
- this._config = _config;
132
+ var EditorComponent = /** @class */ (function () {
133
+ function EditorComponent(_data, _dialogRef, _dialog, _message, _cdRef) {
134
+ var _this = this;
135
+ this._data = _data;
136
+ this._dialogRef = _dialogRef;
250
137
  this._dialog = _dialog;
251
- this.pageTypes = common.index(PageTypes, 'value', 'name');
138
+ this._message = _message;
139
+ this._cdRef = _cdRef;
140
+ this.resizing = false;
141
+ this.editors = { content: true, styles: true };
252
142
  this._destroy$ = new rxjs.Subject();
143
+ this.save = function () {
144
+ return _this._config.saveContentPage({
145
+ id: _this.contentPage.id,
146
+ styles: _this.contentPage.styles,
147
+ content: _this.contentPage.content,
148
+ })
149
+ .pipe(operators.tap(function (contentPage) {
150
+ _this.contentPage = Object.assign(Object.assign({}, _this.contentPage), contentPage);
151
+ _this._cdRef.markForCheck();
152
+ _this._message.success('Saved Changes');
153
+ }));
154
+ };
253
155
  }
254
- FsContentPagesComponent.prototype.ngOnInit = function () {
255
- this._initListConfig();
156
+ EditorComponent.prototype.ngOnInit = function () {
157
+ this.contentPage = this._data.contentPage;
158
+ this._config = this._data.config;
159
+ this._initSeparator();
256
160
  };
257
- FsContentPagesComponent.prototype.openEditor = function (contentPage) {
161
+ EditorComponent.prototype.editorToggleChange = function (event) {
162
+ this.editors[event.value] = !this.editors[event.value];
163
+ this.updateEditorLayouts();
164
+ };
165
+ EditorComponent.prototype.updateEditorLayouts = function () {
258
166
  var _this = this;
259
- this._dialog.open(EditorComponent, {
260
- maxWidth: null,
261
- maxHeight: null,
167
+ setTimeout(function () {
168
+ if (_this.editors.content) {
169
+ _this.contentEditor.updateLayout();
170
+ }
171
+ if (_this.editors.styles) {
172
+ _this.styleEditor.updateLayout();
173
+ }
174
+ });
175
+ };
176
+ EditorComponent.prototype.ngOnDestroy = function () {
177
+ this._destroy$.next();
178
+ this._destroy$.complete();
179
+ };
180
+ EditorComponent.prototype.stylesChanged = function () {
181
+ this.form.triggerSubmit();
182
+ };
183
+ EditorComponent.prototype.contentChanged = function () {
184
+ this.form.triggerSubmit();
185
+ };
186
+ EditorComponent.prototype.openSettings = function () {
187
+ var _this = this;
188
+ this._dialog.open(ContentPageComponent, {
262
189
  data: {
263
- styles: contentPage.styles,
264
- content: contentPage.content,
265
- save: function (data) {
266
- return _this._config.saveContentPage(Object.assign({ id: contentPage.id }, data));
267
- },
190
+ contentPage: this.contentPage,
268
191
  },
269
192
  })
270
193
  .afterClosed()
271
194
  .pipe(operators.takeUntil(this._destroy$))
272
- .subscribe(function () {
273
- _this.listComponent.reload();
195
+ .subscribe(function (contentPage) {
196
+ _this.contentPage = Object.assign(Object.assign({}, _this.contentPage), contentPage);
197
+ _this._cdRef.markForCheck();
274
198
  });
275
199
  };
276
- FsContentPagesComponent.prototype.openPage = function (contentPage) {
200
+ EditorComponent.prototype._initSeparator = function () {
277
201
  var _this = this;
278
- this._dialog.open(ContentPageComponent, {
202
+ rxjs.fromEvent(this.separator.nativeElement, 'mousedown')
203
+ .pipe(operators.takeUntil(this._destroy$))
204
+ .subscribe(function (e) {
205
+ _this._moveSeparator(e);
206
+ });
207
+ };
208
+ EditorComponent.prototype._moveSeparator = function (separatorEvent) {
209
+ var _this = this;
210
+ var mouseDown = {
211
+ clientX: separatorEvent.clientX,
212
+ clientY: separatorEvent.clientY,
213
+ offsetLeft: Number(this.separator.nativeElement.offsetLeft),
214
+ offsetTop: Number(this.separator.nativeElement.offsetTop),
215
+ firstWidth: Number(this.contentContainer.nativeElement.offsetWidth),
216
+ secondWidth: Number(this.styleContainer.nativeElement.offsetWidth),
217
+ };
218
+ this.resizing = true;
219
+ this._cdRef.markForCheck();
220
+ rxjs.fromEvent(document, 'mousemove')
221
+ .pipe(operators.finalize(function () {
222
+ mouseDown = null;
223
+ _this.resizing = false;
224
+ _this._cdRef.markForCheck();
225
+ _this.updateEditorLayouts();
226
+ }), operators.takeUntil(rxjs.fromEvent(this.separator.nativeElement, 'mouseup')
227
+ .pipe(operators.take(1), operators.takeUntil(this._destroy$))), operators.takeUntil(this._destroy$))
228
+ .subscribe(function (e) {
229
+ var delta = { x: e.clientX - mouseDown.clientX,
230
+ y: e.clientY - mouseDown.clientY };
231
+ delta.x = Math.min(Math.max(delta.x, -mouseDown.firstWidth), mouseDown.secondWidth);
232
+ _this.separator.nativeElement.style.left = mouseDown.offsetLeft + delta.x + "px";
233
+ _this.contentContainer.nativeElement.style.width = mouseDown.firstWidth + delta.x + "px";
234
+ _this.styleContainer.nativeElement.style.width = mouseDown.secondWidth - delta.x + "px";
235
+ });
236
+ };
237
+ return EditorComponent;
238
+ }());
239
+ EditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: EditorComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }, { token: i1__namespace.MatDialog }, { token: i2__namespace.FsMessage }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
240
+ EditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: EditorComponent, selector: "ng-component", viewQueries: [{ propertyName: "form", first: true, predicate: i7$1.FsFormDirective, descendants: true }, { propertyName: "styleEditor", first: true, predicate: ["styleEditor"], descendants: true }, { propertyName: "contentEditor", first: true, predicate: ["contentEditor"], descendants: true }, { propertyName: "separator", first: true, predicate: ["separator"], descendants: true, read: i0.ElementRef, static: true }, { propertyName: "contentContainer", first: true, predicate: ["contentContainer"], descendants: true, read: i0.ElementRef, static: true }, { propertyName: "styleContainer", first: true, predicate: ["styleContainer"], descendants: true, read: i0.ElementRef, static: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\">\n <fs-dialog>\n <h1 mat-dialog-title>\n <div class=\"title-container\">\n <div class=\"title\">\n Page\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 <div class=\"container\">\n <div class=\"editors\" [ngClass]=\"{ resizing: resizing, 'separator-enabled': editors.styles && editors.content }\">\n <div #contentContainer class=\"editor editor-content\" [ngClass]=\"{ 'content-enabled': editors.content }\">\n <fs-label>Content</fs-label>\n <div class=\"editor-container\">\n <fs-text-editor \n #contentEditor\n [(ngModel)]=\"contentPage.content\" \n (blur)=\"contentChanged()\"\n name=\"content\"\n [config]=\"{ tabSize: 2, language: 'html' }\">\n </fs-text-editor> \n </div>\n </div>\n <div \n #separator\n class=\"separator\">\n <mat-icon>drag_indicator</mat-icon>\n </div>\n <div \n #styleContainer \n class=\"editor editor-styles\" \n [ngClass]=\"{ 'styles-enabled': editors.styles }\"\n [style.width]=\"'600px'\">\n <fs-label>Styles</fs-label>\n <div class=\"editor-container\">\n <fs-text-editor \n #styleEditor\n [(ngModel)]=\"contentPage.styles\" \n (blur)=\"stylesChanged()\"\n name=\"styles\"\n [config]=\"{ tabSize: 2, language: 'scss' }\">\n </fs-text-editor> \n </div>\n </div> \n </div>\n </div>\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=\"content\" [checked]=\"editors.content\" (change)=\"editorToggleChange($event)\">Content</mat-button-toggle>\n <mat-button-toggle value=\"styles\" [checked]=\"editors.styles\" (change)=\"editorToggleChange($event)\">Styles</mat-button-toggle>\n </mat-button-toggle-group> \n </div>\n </div>\n </fs-dialog>\n</form>\n\n", styles: ["form{display:block;height:100%}form fs-dialog{display:flex;flex-direction:column;height:100%}form ::ng-deep .mat-dialog-content{max-height:none;flex:1}.mat-dialog-actions fs-form-dialog-actions{width:auto}.mat-dialog-actions .toggles{display:flex;justify-content:flex-end;justify-self:baseline;flex:1}.container{height:100%;display:flex;flex-direction:column}.editors{width:5000px;max-width:100%;height:100%;display:flex;min-height:0}.editors:not(.separator-enabled) .separator{display:none}.editors:not(.separator-enabled) .editor{width:100%!important}.editors .separator{display:flex;align-items:center;justify-content:center;cursor:col-resize;background-color:#fff;width:40px;height:100%;-webkit-user-select:none;user-select:none;flex-shrink:0}.editors .editor{height:100%;display:flex;min-width:0;width:100%;flex-direction:column}.editors .editor.editor-styles:not(.styles-enabled),.editors .editor.editor-content:not(.content-enabled){display:none}.editors .editor .editor-container{height:100%;overflow:hidden;background:#1E1E1E;border-radius:5px}.editors .editor .editor-container fs-text-editor{display:block}.editors .editor+.editor{margin-left:20px}.editors .editor fs-label{background-color:#fff;padding-bottom:5px}.title-container{display:flex;align-items:center}.title-container .title{flex:1}.title-container .title .small{line-height:normal}\n"], components: [{ type: i3__namespace.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__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: i5__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i6__namespace$1.FsLabelComponent, selector: "fs-label" }, { type: i7__namespace$1.FsTextEditorComponent, selector: "fs-text-editor", inputs: ["config", "scrollable"], outputs: ["init", "blur"] }, { type: i7__namespace.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }, { type: i9__namespace$1.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: i7__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: i10__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.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]" }, { type: i9__namespace$1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
241
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: EditorComponent, decorators: [{
242
+ type: i0.Component,
243
+ args: [{
244
+ templateUrl: './editor.component.html',
245
+ styleUrls: ['./editor.component.scss'],
246
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
247
+ }]
248
+ }], ctorParameters: function () {
249
+ return [{ type: undefined, decorators: [{
250
+ type: i0.Inject,
251
+ args: [i1.MAT_DIALOG_DATA]
252
+ }] }, { type: i1__namespace.MatDialogRef }, { type: i1__namespace.MatDialog }, { type: i2__namespace.FsMessage }, { type: i0__namespace.ChangeDetectorRef }];
253
+ }, propDecorators: { form: [{
254
+ type: i0.ViewChild,
255
+ args: [i7$1.FsFormDirective]
256
+ }], styleEditor: [{
257
+ type: i0.ViewChild,
258
+ args: ['styleEditor']
259
+ }], contentEditor: [{
260
+ type: i0.ViewChild,
261
+ args: ['contentEditor']
262
+ }], separator: [{
263
+ type: i0.ViewChild,
264
+ args: ['separator', { static: true, read: i0.ElementRef }]
265
+ }], contentContainer: [{
266
+ type: i0.ViewChild,
267
+ args: ['contentContainer', { static: true, read: i0.ElementRef }]
268
+ }], styleContainer: [{
269
+ type: i0.ViewChild,
270
+ args: ['styleContainer', { static: true, read: i0.ElementRef }]
271
+ }] } });
272
+
273
+ var FsContentEditorModule = /** @class */ (function () {
274
+ function FsContentEditorModule() {
275
+ }
276
+ return FsContentEditorModule;
277
+ }());
278
+ FsContentEditorModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
279
+ FsContentEditorModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, declarations: [EditorComponent], imports: [i10.CommonModule,
280
+ i9.FormsModule,
281
+ i1.MatDialogModule,
282
+ i4$1.MatButtonModule,
283
+ tabs.MatTabsModule,
284
+ i5$1.MatIconModule,
285
+ i9$1.MatButtonToggleModule,
286
+ i2$1.FsListModule,
287
+ i7$1.FsFormModule,
288
+ i6$1.FsLabelModule,
289
+ htmlEditor.FsHtmlEditorModule,
290
+ i3.FsDialogModule,
291
+ i7.FsTextEditorModule], exports: [EditorComponent] });
292
+ FsContentEditorModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, imports: [[
293
+ i10.CommonModule,
294
+ i9.FormsModule,
295
+ i1.MatDialogModule,
296
+ i4$1.MatButtonModule,
297
+ tabs.MatTabsModule,
298
+ i5$1.MatIconModule,
299
+ i9$1.MatButtonToggleModule,
300
+ i2$1.FsListModule,
301
+ i7$1.FsFormModule,
302
+ i6$1.FsLabelModule,
303
+ htmlEditor.FsHtmlEditorModule,
304
+ i3.FsDialogModule,
305
+ i7.FsTextEditorModule,
306
+ ]] });
307
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentEditorModule, decorators: [{
308
+ type: i0.NgModule,
309
+ args: [{
310
+ imports: [
311
+ i10.CommonModule,
312
+ i9.FormsModule,
313
+ i1.MatDialogModule,
314
+ i4$1.MatButtonModule,
315
+ tabs.MatTabsModule,
316
+ i5$1.MatIconModule,
317
+ i9$1.MatButtonToggleModule,
318
+ i2$1.FsListModule,
319
+ i7$1.FsFormModule,
320
+ i6$1.FsLabelModule,
321
+ htmlEditor.FsHtmlEditorModule,
322
+ i3.FsDialogModule,
323
+ i7.FsTextEditorModule,
324
+ ],
325
+ exports: [
326
+ EditorComponent,
327
+ ],
328
+ declarations: [
329
+ EditorComponent,
330
+ ],
331
+ }]
332
+ }] });
333
+
334
+ var FsContentPagesComponent = /** @class */ (function () {
335
+ function FsContentPagesComponent(_config, _dialog) {
336
+ this._config = _config;
337
+ this._dialog = _dialog;
338
+ this.pageTypes = common.index(PageTypes, 'value', 'name');
339
+ this._destroy$ = new rxjs.Subject();
340
+ }
341
+ FsContentPagesComponent.prototype.ngOnInit = function () {
342
+ this._initListConfig();
343
+ };
344
+ FsContentPagesComponent.prototype.openEditor = function (contentPage) {
345
+ var _this = this;
346
+ this._dialog.open(EditorComponent, {
279
347
  data: {
280
348
  contentPage: contentPage,
349
+ config: this._config,
281
350
  },
351
+ maxWidth: '100vw',
352
+ maxHeight: '100vw',
353
+ width: '100%',
354
+ height: '100%',
355
+ autoFocus: false,
282
356
  })
283
357
  .afterClosed()
284
358
  .pipe(operators.filter(function (_contentPage) { return !!_contentPage; }), operators.takeUntil(this._destroy$))
@@ -304,7 +378,19 @@
304
378
  {
305
379
  label: 'Create',
306
380
  click: function () {
307
- _this.openPage({});
381
+ _this._dialog.open(ContentPageComponent, {
382
+ data: {
383
+ contentPage: {
384
+ type: PageType.StandardPage,
385
+ },
386
+ },
387
+ })
388
+ .afterClosed()
389
+ .pipe(operators.filter(function (contentPage) { return !!contentPage; }), operators.takeUntil(_this._destroy$))
390
+ .subscribe(function (contentPage) {
391
+ _this.openEditor(contentPage);
392
+ _this.listComponent.reload();
393
+ });
308
394
  },
309
395
  },
310
396
  ],
@@ -341,7 +427,7 @@
341
427
  return FsContentPagesComponent;
342
428
  }());
343
429
  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 });
344
- 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$1.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\">\n <fs-list-column name=\"design\" width=\"1%\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openEditor(row)\"><mat-icon>design_services</mat-icon></a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"name\" title=\"Name\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openPage(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$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i3__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i4__namespace$2.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
430
+ 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$1.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$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }], directives: [{ type: i2__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i3__namespace$1.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
345
431
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentPagesComponent, decorators: [{
346
432
  type: i0.Component,
347
433
  args: [{
@@ -378,40 +464,40 @@
378
464
  i9.FormsModule,
379
465
  i1.MatDialogModule,
380
466
  i11.MatInputModule,
381
- i4$1.MatFormFieldModule,
382
- button.MatButtonModule,
467
+ i4.MatFormFieldModule,
468
+ i4$1.MatButtonModule,
383
469
  tabs.MatTabsModule,
384
- i3$1.MatIconModule,
385
- i5$1.MatSelectModule,
386
- i4.MatButtonToggleModule,
470
+ i5$1.MatIconModule,
471
+ i5.MatSelectModule,
472
+ i9$1.MatButtonToggleModule,
387
473
  i2$1.FsListModule,
388
- i4$2.FsDateModule,
389
- i7.FsFormModule,
390
- i5.FsLabelModule,
474
+ i3$1.FsDateModule,
475
+ i7$1.FsFormModule,
476
+ i6$1.FsLabelModule,
391
477
  i8.FsSkeletonModule,
392
478
  htmlEditor.FsHtmlEditorModule,
393
479
  i3.FsDialogModule,
394
- i6.FsTextEditorModule,
480
+ i7.FsTextEditorModule,
395
481
  FsContentEditorModule], exports: [FsContentPagesComponent] });
396
482
  FsContentPagesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentPagesModule, imports: [[
397
483
  i10.CommonModule,
398
484
  i9.FormsModule,
399
485
  i1.MatDialogModule,
400
486
  i11.MatInputModule,
401
- i4$1.MatFormFieldModule,
402
- button.MatButtonModule,
487
+ i4.MatFormFieldModule,
488
+ i4$1.MatButtonModule,
403
489
  tabs.MatTabsModule,
404
- i3$1.MatIconModule,
405
- i5$1.MatSelectModule,
406
- i4.MatButtonToggleModule,
490
+ i5$1.MatIconModule,
491
+ i5.MatSelectModule,
492
+ i9$1.MatButtonToggleModule,
407
493
  i2$1.FsListModule,
408
- i4$2.FsDateModule,
409
- i7.FsFormModule,
410
- i5.FsLabelModule,
494
+ i3$1.FsDateModule,
495
+ i7$1.FsFormModule,
496
+ i6$1.FsLabelModule,
411
497
  i8.FsSkeletonModule,
412
498
  htmlEditor.FsHtmlEditorModule,
413
499
  i3.FsDialogModule,
414
- i6.FsTextEditorModule,
500
+ i7.FsTextEditorModule,
415
501
  FsContentEditorModule,
416
502
  ]] });
417
503
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentPagesModule, decorators: [{
@@ -422,20 +508,20 @@
422
508
  i9.FormsModule,
423
509
  i1.MatDialogModule,
424
510
  i11.MatInputModule,
425
- i4$1.MatFormFieldModule,
426
- button.MatButtonModule,
511
+ i4.MatFormFieldModule,
512
+ i4$1.MatButtonModule,
427
513
  tabs.MatTabsModule,
428
- i3$1.MatIconModule,
429
- i5$1.MatSelectModule,
430
- i4.MatButtonToggleModule,
514
+ i5$1.MatIconModule,
515
+ i5.MatSelectModule,
516
+ i9$1.MatButtonToggleModule,
431
517
  i2$1.FsListModule,
432
- i4$2.FsDateModule,
433
- i7.FsFormModule,
434
- i5.FsLabelModule,
518
+ i3$1.FsDateModule,
519
+ i7$1.FsFormModule,
520
+ i6$1.FsLabelModule,
435
521
  i8.FsSkeletonModule,
436
522
  htmlEditor.FsHtmlEditorModule,
437
523
  i3.FsDialogModule,
438
- i6.FsTextEditorModule,
524
+ i7.FsTextEditorModule,
439
525
  FsContentEditorModule,
440
526
  ],
441
527
  exports: [
@@ -488,7 +574,7 @@
488
574
  return ContentLayoutComponent;
489
575
  }());
490
576
  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 });
491
- ContentLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentLayoutComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i6.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.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.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: i7__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"] }, { 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: i11__namespace.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: i7__namespace.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i7__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 });
577
+ ContentLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ContentLayoutComponent, selector: "ng-component", viewQueries: [{ propertyName: "textEditors", predicate: i7.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.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileActionPlacement", "mobileWidth", "mode"] }, { type: i4__namespace.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i7__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: i7__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: i11__namespace.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: i7__namespace.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i7__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 });
492
578
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentLayoutComponent, decorators: [{
493
579
  type: i0.Component,
494
580
  args: [{
@@ -506,7 +592,7 @@
506
592
  }] }, { type: i1__namespace.MatDialogRef }, { type: i2__namespace.FsMessage }, { type: i0__namespace.ChangeDetectorRef }];
507
593
  }, propDecorators: { textEditors: [{
508
594
  type: i0.ViewChildren,
509
- args: [i6.FsTextEditorComponent]
595
+ args: [i7.FsTextEditorComponent]
510
596
  }] } });
511
597
 
512
598
  var FsContentLayoutsComponent = /** @class */ (function () {
@@ -606,7 +692,7 @@
606
692
  return FsContentLayoutsComponent;
607
693
  }());
608
694
  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 });
609
- 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$1.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\">\n <fs-list-column name=\"design\" width=\"1%\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openEditor(row)\"><mat-icon>design_services</mat-icon></a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"name\" title=\"Name\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openLayout(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$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i3__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i4__namespace$2.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
695
+ 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$1.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\">\n <fs-list-column name=\"design\" width=\"1%\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openEditor(row)\"><mat-icon>design_services</mat-icon></a>\n </ng-template>\n </fs-list-column>\n <fs-list-column name=\"name\" title=\"Name\" [sortable]=\"true\">\n <ng-template fs-list-cell let-row=\"row\">\n <a (click)=\"openLayout(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$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i5__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i2__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }], pipes: { "fsDate": i3__namespace$1.FsDatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
610
696
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentLayoutsComponent, decorators: [{
611
697
  type: i0.Component,
612
698
  args: [{
@@ -636,40 +722,40 @@
636
722
  i9.FormsModule,
637
723
  i1.MatDialogModule,
638
724
  i11.MatInputModule,
639
- i4$1.MatFormFieldModule,
640
- button.MatButtonModule,
725
+ i4.MatFormFieldModule,
726
+ i4$1.MatButtonModule,
641
727
  tabs.MatTabsModule,
642
- i3$1.MatIconModule,
643
- i5$1.MatSelectModule,
644
- i4.MatButtonToggleModule,
728
+ i5$1.MatIconModule,
729
+ i5.MatSelectModule,
730
+ i9$1.MatButtonToggleModule,
645
731
  i2$1.FsListModule,
646
- i4$2.FsDateModule,
647
- i7.FsFormModule,
648
- i5.FsLabelModule,
732
+ i3$1.FsDateModule,
733
+ i7$1.FsFormModule,
734
+ i6$1.FsLabelModule,
649
735
  i8.FsSkeletonModule,
650
736
  htmlEditor.FsHtmlEditorModule,
651
737
  i3.FsDialogModule,
652
- i6.FsTextEditorModule,
738
+ i7.FsTextEditorModule,
653
739
  FsContentEditorModule], exports: [FsContentLayoutsComponent] });
654
740
  FsContentLayoutsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentLayoutsModule, imports: [[
655
741
  i10.CommonModule,
656
742
  i9.FormsModule,
657
743
  i1.MatDialogModule,
658
744
  i11.MatInputModule,
659
- i4$1.MatFormFieldModule,
660
- button.MatButtonModule,
745
+ i4.MatFormFieldModule,
746
+ i4$1.MatButtonModule,
661
747
  tabs.MatTabsModule,
662
- i3$1.MatIconModule,
663
- i5$1.MatSelectModule,
664
- i4.MatButtonToggleModule,
748
+ i5$1.MatIconModule,
749
+ i5.MatSelectModule,
750
+ i9$1.MatButtonToggleModule,
665
751
  i2$1.FsListModule,
666
- i4$2.FsDateModule,
667
- i7.FsFormModule,
668
- i5.FsLabelModule,
752
+ i3$1.FsDateModule,
753
+ i7$1.FsFormModule,
754
+ i6$1.FsLabelModule,
669
755
  i8.FsSkeletonModule,
670
756
  htmlEditor.FsHtmlEditorModule,
671
757
  i3.FsDialogModule,
672
- i6.FsTextEditorModule,
758
+ i7.FsTextEditorModule,
673
759
  FsContentEditorModule,
674
760
  ]] });
675
761
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsContentLayoutsModule, decorators: [{
@@ -680,20 +766,20 @@
680
766
  i9.FormsModule,
681
767
  i1.MatDialogModule,
682
768
  i11.MatInputModule,
683
- i4$1.MatFormFieldModule,
684
- button.MatButtonModule,
769
+ i4.MatFormFieldModule,
770
+ i4$1.MatButtonModule,
685
771
  tabs.MatTabsModule,
686
- i3$1.MatIconModule,
687
- i5$1.MatSelectModule,
688
- i4.MatButtonToggleModule,
772
+ i5$1.MatIconModule,
773
+ i5.MatSelectModule,
774
+ i9$1.MatButtonToggleModule,
689
775
  i2$1.FsListModule,
690
- i4$2.FsDateModule,
691
- i7.FsFormModule,
692
- i5.FsLabelModule,
776
+ i3$1.FsDateModule,
777
+ i7$1.FsFormModule,
778
+ i6$1.FsLabelModule,
693
779
  i8.FsSkeletonModule,
694
780
  htmlEditor.FsHtmlEditorModule,
695
781
  i3.FsDialogModule,
696
- i6.FsTextEditorModule,
782
+ i7.FsTextEditorModule,
697
783
  FsContentEditorModule,
698
784
  ],
699
785
  exports: [