@social-mail/social-mail-client 1.2.20 → 1.2.22

package/dist/web/AppIndex.pack.js

@@ -26083,11 +26083,13 @@ System.register(["tslib", "@web-atoms/core/dist/di/DISingleton", "@web-atoms/cor
             const {
               appFileID,
               content,
-              parentID
+              parentID,
+              folder
             } = fm;
             return this.localFileService.uploadFile(content, {
               appFileID,
-              parentID
+              parentID,
+              folder
             });
           });
         }
@@ -33759,6 +33761,7 @@ System.register(["./Styler", "./properties/stylerBorder", "./properties/layouts/
       _export("StylerSet", StylerSet = class StylerSet {
         constructor() {
           this.vars = vars;
+          this.varsCss = this.vars.join("\n\t\t\t");
           this.properties = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({
             stylerLayout,
             stylerColorSets,
@@ -34991,10 +34994,15 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
             }, 100);
             return;
           }
-          void this.ready.then(() => {
+          void this.ready.then(() => __awaiter(this, void 0, void 0, function* () {
             if (!this.htmlDocument) {
               return;
             }
+            const iframe = this.element;
+            if (this.htmlDocument !== iframe.contentDocument) {
+              this.htmlDocument = void 0;
+              yield this.loadContentDocument();
+            }
             this.htmlDocument.open();
             this.htmlDocument.write(v);
             this.htmlDocument.addEventListener("click", e => {
@@ -35072,7 +35080,7 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
                 this.loadVariables();
               }));
             }, 10);
-          });
+          }));
         }
         constructor(app, e) {
           super(app, e);
@@ -35173,11 +35181,7 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
             }, XNode.create("i", {
               class: "fas fa-code"
             }), "Variables"), XNode.create(Properties, null))));
-            this.contentEditor = this.element.querySelector(`[data-element="content-editor"]`);
-            while (!this.htmlDocument) {
-              this.htmlDocument = this.contentEditor.contentDocument;
-              yield sleep(100);
-            }
+            yield this.loadContentDocument();
           });
         }
         buildXNode(node) {
@@ -35358,6 +35362,15 @@ System.register(["tslib", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dis
           };
           this.pageVariables = StylerSet.instance.vars.map(x => new StylerVariable(x.name, x.value, this.htmlDocument, onChange));
         }
+        loadContentDocument() {
+          return __awaiter(this, void 0, void 0, function* () {
+            this.contentEditor = this.element.querySelector(`[data-element="content-editor"]`);
+            while (!this.htmlDocument) {
+              this.htmlDocument = this.contentEditor.contentDocument;
+              yield sleep(100);
+            }
+          });
+        }
       });
       __decorate([Action({
         onEvent: "delete-element"
@@ -35535,10 +35548,10 @@ System.register(["tslib", "@web-atoms/core/dist/style/styled", "@web-atoms/core/
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/common/controls/drag-drop/FilesDragDrop");
 
-System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "../../../../common/controls/tree/FileTreeView", "@web-atoms/web-controls/dist/basic/AtomRepeater", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/InjectProperty", "../service/CloudFileService", "@web-atoms/core/dist/style/styled", "../../../../common/controls/drag-drop/FilesDragDrop", "@web-atoms/core/dist/view-model/Action", "@web-atoms/web-controls/dist/basic/UploadEvent"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "../../../../common/controls/tree/FileTreeView", "@web-atoms/web-controls/dist/basic/AtomRepeater", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/InjectProperty", "../service/CloudFileService", "@web-atoms/core/dist/style/styled", "../../../../common/controls/drag-drop/FilesDragDrop", "@web-atoms/core/dist/view-model/Action", "@web-atoms/web-controls/dist/basic/UploadEvent", "../../../../common/controls/buttons/IconButton"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, PopupWindowPage, XNode, FolderTreeView, AtomRepeater, Bind, InjectProperty, CloudFileService, styled, FilesDragDrop, Action, UploadEvent, ChooseMediaPage, css;
+  var __awaiter, __decorate, __metadata, PopupWindowPage, XNode, FolderTreeView, AtomRepeater, Bind, InjectProperty, CloudFileService, styled, FilesDragDrop, Action, UploadEvent, SaveIconTextButton, ChooseMediaPage, css;
   _export("default", void 0);
   return {
     setters: [function (_tslib) {
@@ -35567,18 +35580,25 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
       Action = _webAtomsCoreDistViewModelAction.default;
     }, function (_webAtomsWebControlsDistBasicUploadEvent) {
       UploadEvent = _webAtomsWebControlsDistBasicUploadEvent.default;
+    }, function (_commonControlsButtonsIconButton) {
+      SaveIconTextButton = _commonControlsButtonsIconButton.SaveIconTextButton;
     }],
     execute: function () {
       css = styled.css`
     display: grid;
     grid-template-columns: 200px 1fr;
+    grid-template-rows: auto 1fr;
     gap: 5px;
     & .folder-tree {
         grid-column: 1;
+        grid-row: 1 / span 2;
+    }
+    & .search {
+        grid-column: 2;
         grid-row: 1;
     }
     & .file-list {
-        grid-row: 1;
+        grid-row: 2;
         grid-column: 2;
         position: relative;
         overflow: auto;
@@ -35624,10 +35644,30 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
             this.renderer = XNode.create("div", {
               class: css
             }, XNode.create(FolderTreeView, {
+              class: "folder-tree",
               accept: accept,
               folderId: this.parameters.folder.appFileID,
               selectedItem: Bind.twoWaysImmediate(() => this.selectedFolder)
-            }), XNode.create("div", Object.assign({
+            }), XNode.create("div", {
+              class: "search",
+              "data-layout": "row"
+            }, XNode.create("input", {
+              type: "search",
+              value: Bind.twoWaysImmediate(() => this.search)
+            }), XNode.create("button", Object.assign({
+              "data-layout": "accent-icon-button"
+            }, UploadEvent.AttachUploadAction({
+              multiple: true,
+              extra: Bind.oneWay(() => {
+                var _a;
+                return JSON.stringify({
+                  parentID: (_a = this.selectedFolder) === null || _a === void 0 ? void 0 : _a.appFileID
+                });
+              }),
+              accept
+            })), XNode.create("i", {
+              class: "fas fa-upload"
+            }), "Upload")), XNode.create("div", Object.assign({
               class: "file-list"
             }, FilesDragDrop({
               extra: Bind.oneWay(() => {
@@ -35659,23 +35699,6 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
               }))
             })));
             this.footerRenderer = () => XNode.create("div", {
-              "data-layout": "frame-vertical-flex"
-            }, XNode.create("div", {
-              "data-layout": "row"
-            }, XNode.create("button", Object.assign({
-              "data-layout": "accent-icon-button"
-            }, UploadEvent.AttachUploadAction({
-              multiple: true,
-              extra: Bind.oneWay(() => {
-                var _a;
-                return JSON.stringify({
-                  parentID: (_a = this.selectedFolder) === null || _a === void 0 ? void 0 : _a.appFileID
-                });
-              }),
-              accept
-            })), XNode.create("i", {
-              class: "fas fa-upload"
-            }), "Upload")), XNode.create("div", {
               "style-display": Bind.oneWay(() => this.selectedFile !== null),
               "data-layout": "row"
             }, XNode.create("input", {
@@ -35686,10 +35709,10 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
               value: Bind.twoWaysImmediate(() => this.size)
             }), XNode.create("span", {
               text: Bind.oneWay(() => `${this.size}px`)
-            }), XNode.create("button", {
+            }), XNode.create(SaveIconTextButton, {
               "data-click-event": "select-file",
-              text: "Save"
-            })));
+              text: "Insert"
+            }));
           });
         }
         selectFile() {
@@ -35751,6 +35774,7 @@ System.register(["tslib", "@web-atoms/core/dist/core/types", "@web-atoms/core/di
           this.runAfterInit(() => this.app.runAsync(() => this.init()));
         }
         onPropertyChanged(name) {
+          super.onPropertyChanged(name);
           switch (name) {
             case "file":
               this.app.runAsync(() => this.loadFile());
@@ -35790,14 +35814,16 @@ System.register(["tslib", "@web-atoms/core/dist/core/types", "@web-atoms/core/di
           return editor;
         }
         loadFile() {
+          var _a;
           return __awaiter(this, void 0, void 0, function* () {
             yield this.init();
+            (_a = this.codeModelDisposable) === null || _a === void 0 ? void 0 : _a.dispose();
             const editor = yield this.createEditor();
             const {
               file,
               monaco
             } = this;
-            const content = yield FetchBuilder.get(file.downloadUrl).responseAsText();
+            const originalContent = yield FetchBuilder.get(file.downloadUrl).responseAsText();
             const name = file.name;
             let language = "html";
             if (/\.(ts|tsx)$/i.test(name)) {
@@ -35811,8 +35837,24 @@ System.register(["tslib", "@web-atoms/core/dist/core/types", "@web-atoms/core/di
             }
             const uri = monaco.Uri.parse(`http://a/${file.path}-${file.name}`);
             const m = monaco.editor.getModel(uri);
-            const model = monaco.editor.createModel(content, language, uri);
+            const model = monaco.editor.createModel(originalContent, language, uri);
             editor.setModel(model);
+            let id = 0;
+            this.codeModelDisposable = this.registerDisposable(model.onDidChangeContent(() => {
+              if (id) {
+                clearTimeout(id);
+              }
+              id = setTimeout(() => {
+                const content = model.getValue();
+                this.element.dispatchEvent(new CustomEvent("fileChanged", {
+                  detail: {
+                    file: this.file,
+                    content,
+                    originalContent
+                  }
+                }));
+              }, 500);
+            }));
           });
         }
       });
@@ -35824,23 +35866,39 @@ System.register(["tslib", "@web-atoms/core/dist/core/types", "@web-atoms/core/di
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/code-editor/MonaoEditor");
 
-System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "./MonaoEditor"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "./MonaoEditor", "../common/controls/buttons/IconButton", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/view-model/Action", "@web-atoms/core/dist/core/InjectProperty", "../web/page/files/service/CloudFileService"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, PopupWindowPage, XNode, MonacoEditor, CodeEditorPage;
+  var __awaiter, __decorate, __metadata, ContentPage, XNode, MonacoEditor, SaveIconTextButton, Bind, Action, InjectProperty, CloudFileService, CodeEditorPage;
   _export("default", void 0);
   return {
     setters: [function (_tslib) {
       __awaiter = _tslib.__awaiter;
+      __decorate = _tslib.__decorate;
+      __metadata = _tslib.__metadata;
     }, function (_webAtomsWebControlsDistMobileAppMobileApp) {
-      PopupWindowPage = _webAtomsWebControlsDistMobileAppMobileApp.PopupWindowPage;
+      ContentPage = _webAtomsWebControlsDistMobileAppMobileApp.ContentPage;
     }, function (_webAtomsCoreDistCoreXNode) {
       XNode = _webAtomsCoreDistCoreXNode.default;
     }, function (_MonaoEditor) {
       MonacoEditor = _MonaoEditor.default;
+    }, function (_commonControlsButtonsIconButton) {
+      SaveIconTextButton = _commonControlsButtonsIconButton.SaveIconTextButton;
+    }, function (_webAtomsCoreDistCoreBind) {
+      Bind = _webAtomsCoreDistCoreBind.default;
+    }, function (_webAtomsCoreDistViewModelAction) {
+      Action = _webAtomsCoreDistViewModelAction.default;
+    }, function (_webAtomsCoreDistCoreInjectProperty) {
+      InjectProperty = _webAtomsCoreDistCoreInjectProperty.default;
+    }, function (_webPageFilesServiceCloudFileService) {
+      CloudFileService = _webPageFilesServiceCloudFileService.default;
     }],
     execute: function () {
-      _export("default", CodeEditorPage = class CodeEditorPage extends PopupWindowPage {
+      _export("default", CodeEditorPage = class CodeEditorPage extends ContentPage {
+        constructor() {
+          super(...arguments);
+          this.modified = false;
+        }
         init() {
           return __awaiter(this, void 0, void 0, function* () {
             this.title = this.parameters.name;
@@ -35849,11 +35907,62 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
               "data-align-items": "stretch",
               "data-justify-items": "stretch"
             }, XNode.create(MonacoEditor, {
-              file: this.parameters
+              file: this.parameters,
+              "event-file-changed": ({
+                detail: {
+                  content,
+                  originalContent,
+                  file
+                }
+              }) => {
+                this.file = file;
+                this.modified = content !== originalContent;
+                this.content = content;
+              }
+            }));
+            this.footerRenderer = () => XNode.create("div", {
+              "data-layout": "command-row",
+              "style-display": Bind.oneWay(() => this.modified, false)
+            }, XNode.create(SaveIconTextButton, {
+              "data-click-event": "save-file",
+              text: "Save"
             }));
           });
         }
+        saveFile() {
+          return __awaiter(this, void 0, void 0, function* () {
+            const {
+              file: {
+                appFileID,
+                name,
+                contentType
+              },
+              content
+            } = this;
+            yield this.cloudFileService.saveFile({
+              content: new File([content], name, {
+                type: contentType
+              }),
+              appFileID
+            });
+            return yield this.cloudFileService.getFile(appFileID);
+          });
+        }
+        hide() {
+          this.element.setAttribute("data-page-state", "hidden");
+        }
+        show() {
+          if (!this.element._logicalParent.contains(this.element)) {
+            this.element._logicalParent.appendChild(this.element);
+          }
+          setTimeout(() => this.element.setAttribute("data-page-state", "ready"), 1);
+        }
       });
+      __decorate([InjectProperty, __metadata("design:type", CloudFileService)], CodeEditorPage.prototype, "cloudFileService", void 0);
+      __decorate([Action({
+        onEvent: "save-file",
+        close: true
+      }), __metadata("design:type", Function), __metadata("design:paramtypes", []), __metadata("design:returntype", Promise)], CodeEditorPage.prototype, "saveFile", null);
     }
   };
 });
@@ -35911,8 +36020,9 @@ System.register(["tslib", "@web-atoms/core/dist/core/BindableProperty", "./HtmlP
         }
         openVariables() {
           return __awaiter(this, void 0, void 0, function* () {
-            const file = yield this.cloudFileService.children(this.folder.appFileID, "vars.css").firstOrDefault();
-            yield PageNavigator.pushPage(CodeEditorPage, file);
+            const file = yield this.cloudFileService.children(this.folder.appFileID, "styles/vars.css").firstOrDefault();
+            const changedFile = yield PageNavigator.pushPage(CodeEditorPage, file);
+            yield this.addStyleSheet(changedFile);
           });
         }
         setStylerSheet() {
@@ -35922,6 +36032,7 @@ System.register(["tslib", "@web-atoms/core/dist/core/BindableProperty", "./HtmlP
             let vars = yield this.cloudFileService.children(this.folder.appFileID, "styles/vars.css").firstOrDefault();
             if (!vars) {
               vars = yield this.createFile("vars.css", `* {
+                ${StylerSet.instance.varsCss}
             }`);
             }
             yield this.addStyleSheet(vars);
@@ -36140,6 +36251,7 @@ System.register(["tslib", "@web-atoms/core/dist/core/InjectProperty", "@web-atom
             }), XNode.create(WebSitePageEditor, {
               class: "file-list",
               folder: this.root,
+              presenter: Bind.presenter(c => this.htmlEditor = c),
               "event-html-page-changed": ce => this.pageContent = ce.detail,
               htmlPage: Bind.oneWayAsync((s, e, cancelToken) => this.selectedFile ? FetchBuilder.get(this.selectedFile.downloadUrl).cancelToken(cancelToken).responseAsText(true) : void 0)
             }));
@@ -36209,6 +36321,16 @@ System.register(["tslib", "@web-atoms/core/dist/core/InjectProperty", "@web-atom
             this.pageContent = "";
           });
         }
+        hide() {
+          this.pageContent = this.htmlEditor.htmlPage;
+          super.hide();
+        }
+        show() {
+          super.show();
+          if (this.pageContent) {
+            setTimeout(() => this.htmlEditor.htmlPage = this.pageContent, 400);
+          }
+        }
       });
       __decorate([InjectProperty, __metadata("design:type", CloudFileService)], WebSiteStudioPage.prototype, "cloudFileService", void 0);
       __decorate([Action({