@firestitch/content 12.3.3 → 12.3.4

Sign up to get free protection for your applications and to get access to all the features.
@@ -3,6 +3,7 @@ import { MatButtonToggleChange } from '@angular/material/button-toggle';
3
3
  import { MatDialog, MatDialogRef } from '@angular/material/dialog';
4
4
  import { FsMessage } from '@firestitch/message';
5
5
  import { FsPrompt } from '@firestitch/prompt';
6
+ import { Observable } from 'rxjs';
6
7
  import { FsContentConfig } from '../../../../interfaces';
7
8
  import { EditorComponent } from '../../../editor/components/editor';
8
9
  import * as i0 from "@angular/core";
@@ -43,8 +44,9 @@ export declare class ContentPageEditorComponent implements OnInit, OnDestroy {
43
44
  ngOnDestroy(): void;
44
45
  _initContentPage(contentPage: any): void;
45
46
  editorFocused(type: any): void;
46
- save: () => import("rxjs").Subscription;
47
- saveContentPage(): import("rxjs").Observable<import("../../../../interfaces").FsContentPage>;
47
+ save(): void;
48
+ submit: () => Observable<any>;
49
+ saveContentPage(): Observable<import("../../../../interfaces").FsContentPage>;
48
50
  close(): void;
49
51
  openSettings(): void;
50
52
  private _initEscape;
@@ -2,7 +2,7 @@
2
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/tooltip'), require('@angular/material/core'), require('@angular/router'), require('@angular/platform-browser'), require('@firestitch/html')) :
3
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/tooltip', '@angular/material/core', '@angular/router', '@angular/platform-browser', '@firestitch/html'], factory) :
4
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, global.i5, global.htmlEditor, global.label, global.i2$2, global.i8, global.i4, global.i7, global.i2$1, global.rxjs, global.rxjs.operators, global.i2, global.i3$1, global.filter, global.ng.material.tooltip, global.ng.material.core, global.ng.router, global.ng.platformBrowser, global.i3$3));
5
- })(this, (function (exports, i1, i0, i9, i5$1, i8$1, i1$1, i4$1, i6, i8$2, i5$2, tabs, i3$2, i3, i5, htmlEditor, label, i2$2, i8, i4, i7, i2$1, rxjs, operators, i2, i3$1, filter, i11, i6$1, i2$3, i1$2, i3$3) { 'use strict';
5
+ })(this, (function (exports, i1, i0, i9, i5$1, i8$1, i1$1, i4$1, i6, i8$2, i5$2, tabs, i3$2, i3, i5, htmlEditor, label, i2$2, i8, i4, i7, i2$1, rxjs, operators, i2, i3$1, filter, i12, i6$1, i2$3, i1$2, i3$3) { 'use strict';
6
6
 
7
7
  function _interopNamespace(e) {
8
8
  if (e && e.__esModule) return e;
@@ -42,7 +42,7 @@
42
42
  var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
43
43
  var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
44
44
  var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
45
- var i11__namespace = /*#__PURE__*/_interopNamespace(i11);
45
+ var i12__namespace = /*#__PURE__*/_interopNamespace(i12);
46
46
  var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
47
47
  var i2__namespace$3 = /*#__PURE__*/_interopNamespace(i2$3);
48
48
  var i1__namespace$2 = /*#__PURE__*/_interopNamespace(i1$2);
@@ -805,10 +805,10 @@
805
805
  _a[EditorType.GlobalScss] = false,
806
806
  _a);
807
807
  this._destroy$ = new rxjs.Subject();
808
- this.save = function () {
808
+ this.submit = function () {
809
809
  _this.submitting = true;
810
810
  return rxjs.of(null)
811
- .pipe(operators.filter(function () { return _this.focused; }), operators.delay(3000), operators.switchMap(function () {
811
+ .pipe(operators.filter(function () { return _this.focused; }), operators.switchMap(function () {
812
812
  switch (_this.focused) {
813
813
  case EditorType.Js:
814
814
  case EditorType.Html:
@@ -818,15 +818,14 @@
818
818
  return _this.editor.saveGlobalScss();
819
819
  }
820
820
  return rxjs.throwError('Invalid focus');
821
- }))
822
- .pipe(operators.takeUntil(_this._destroy$))
823
- .subscribe(function () {
821
+ }), operators.tap(function () {
824
822
  _this.editor.clearChange(_this.focused);
825
823
  _this._cdRef.markForCheck();
826
- }, function () { }, function () {
824
+ }), operators.finalize(function () {
827
825
  _this.submitting = false;
828
826
  _this._cdRef.markForCheck();
829
- });
827
+ }))
828
+ .pipe(operators.takeUntil(_this._destroy$));
830
829
  };
831
830
  }
832
831
  Object.defineProperty(ContentPageEditorComponent.prototype, "isMac", {
@@ -861,6 +860,10 @@
861
860
  ContentPageEditorComponent.prototype.editorFocused = function (type) {
862
861
  this.focused = type;
863
862
  };
863
+ ContentPageEditorComponent.prototype.save = function () {
864
+ this.submit()
865
+ .subscribe();
866
+ };
864
867
  ContentPageEditorComponent.prototype.saveContentPage = function () {
865
868
  var _a, _b;
866
869
  var _this = this;
@@ -935,7 +938,7 @@
935
938
  return ContentPageEditorComponent;
936
939
  }());
937
940
  ContentPageEditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageEditorComponent, deps: [{ token: i1$1.MAT_DIALOG_DATA }, { token: i1__namespace$1.MatDialogRef }, { token: i2__namespace.FsMessage }, { token: i1__namespace$1.MatDialog }, { token: i0__namespace.ChangeDetectorRef }, { token: i3__namespace$1.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
938
- 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: "<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\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\n <div class=\"actions\">\n <button\n #submit\n mat-button\n [disabled]=\"!editor?.hasChanges || submitting\"\n [matTooltip]=\"isMac ? 'cmd+s' : 'ctrl+s'\"\n type=\"button\"\n (click)=\"save()\"> \n Save\n </button>\n\n <button \n mat-button\n (click)=\"close()\"\n type=\"button\"> \n Done\n </button>\n </div>\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</fs-dialog>\n ", 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}h1 .toggles{display:flex;justify-content:flex-end;justify-self:baseline;font-size:13px}h1 .actions{margin-left:30px}h1 .actions .mat-button{border:solid 1px rgba(0,0,0,.12);line-height:48px;margin-right:10px;font-weight:600}h1 .actions .mat-button:last-child{margin-right:0}h1 .actions .mat-button ::ng-deep .svg-icon-process{display:none}.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: 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: 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"] }, { 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: EditorComponent, selector: "app-editor", inputs: ["showHtml", "showScss", "showJs", "showGlobalScss", "html", "scss", "js", "contentConfig"], outputs: ["changed", "focused", "blured"] }], directives: [{ type: i8__namespace.FsSkeletonFormDirective, selector: "[fsSkeletonForm]", inputs: ["fsSkeletonForm", "fsSkeletonFormLines"] }, { type: i1__namespace$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i8__namespace$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { type: i5__namespace.FsButtonDirective, selector: "[mat-raised-button],[mat-button],[mat-flat-button],[mat-stroked-button]", inputs: ["name", "dirtySubmit", "form"] }, { type: i11__namespace.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1__namespace$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
941
+ 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]=\"submit\" [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\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\n <div class=\"actions\">\n <button\n #submit\n mat-button\n [disabled]=\"!editor?.hasChanges || submitting\"\n [matTooltip]=\"isMac ? 'cmd+s' : 'ctrl+s'\"\n type=\"button\"\n (click)=\"save()\"> \n Save\n </button>\n\n <button \n mat-button\n (click)=\"close()\"\n type=\"button\"> \n Done\n </button>\n </div>\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 </fs-dialog>\n</form>\n", 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}h1 .toggles{display:flex;justify-content:flex-end;justify-self:baseline;font-size:13px}h1 .actions{margin-left:30px}h1 .actions .mat-button{border:solid 1px rgba(0,0,0,.12);line-height:48px;margin-right:10px;font-weight:600}h1 .actions .mat-button:last-child{margin-right:0}h1 .actions .mat-button ::ng-deep .svg-icon-process{display:none}.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: 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: 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"] }, { 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: EditorComponent, selector: "app-editor", inputs: ["showHtml", "showScss", "showJs", "showGlobalScss", "html", "scss", "js", "contentConfig"], outputs: ["changed", "focused", "blured"] }], 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$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i8__namespace$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { type: i5__namespace.FsButtonDirective, selector: "[mat-raised-button],[mat-button],[mat-flat-button],[mat-stroked-button]", inputs: ["name", "dirtySubmit", "form"] }, { type: i12__namespace.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1__namespace$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
939
942
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ContentPageEditorComponent, decorators: [{
940
943
  type: i0.Component,
941
944
  args: [{
@@ -1095,7 +1098,7 @@
1095
1098
  i6.MatIconModule,
1096
1099
  i5$2.MatSelectModule,
1097
1100
  i8$1.MatButtonToggleModule,
1098
- i11.MatTooltipModule,
1101
+ i12.MatTooltipModule,
1099
1102
  i2$2.FsListModule,
1100
1103
  i3$2.FsDateModule,
1101
1104
  i7.FsCommonModule,
@@ -1117,7 +1120,7 @@
1117
1120
  i6.MatIconModule,
1118
1121
  i5$2.MatSelectModule,
1119
1122
  i8$1.MatButtonToggleModule,
1120
- i11.MatTooltipModule,
1123
+ i12.MatTooltipModule,
1121
1124
  i2$2.FsListModule,
1122
1125
  i3$2.FsDateModule,
1123
1126
  i7.FsCommonModule,
@@ -1143,7 +1146,7 @@
1143
1146
  i6.MatIconModule,
1144
1147
  i5$2.MatSelectModule,
1145
1148
  i8$1.MatButtonToggleModule,
1146
- i11.MatTooltipModule,
1149
+ i12.MatTooltipModule,
1147
1150
  i2$2.FsListModule,
1148
1151
  i3$2.FsDateModule,
1149
1152
  i7.FsCommonModule,