@web-atoms/web-controls 2.1.265 → 2.1.268

package/dist/html-editor/AtomHtmlEditor.sys.js

@@ -0,0 +1,332 @@
+System.register(["@web-atoms/core/dist/core/AtomBinder", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/BindableProperty", "@web-atoms/core/dist/core/Colors", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/style/StyleRule", "@web-atoms/core/dist/web/controls/AtomControl", "@web-atoms/core/dist/web/styles/CSS", "../basic/AtomRepeater", "./commands/AddImage", "./commands/AddLink", "./commands/Align", "./commands/AttachFile", "./commands/Bold", "./commands/ChangeColor", "./commands/ChangeFont", "./commands/ChangeFontSize", "./commands/Headings", "./commands/HorizontalRule", "./commands/IndentLess", "./commands/IndentMore", "./commands/Italic", "./commands/NumberedList", "./commands/RemoveFormat", "./commands/Separator", "./commands/Source", "./commands/StrikeThrough", "./commands/Underline", "./commands/Unlink", "./commands/UnorderedList"], function (_export, _context) {
+  "use strict";
+
+  var AtomBinder, Bind, BindableProperty, Colors, XNode, StyleRule, AtomControl, CSS, AtomRepeater, AddImage, showImageDialog, AddLink, Align, AttachFile, Bold, ChangeColor, ChangeFont, ChangeFontSize, Headings, HorizontalRule, IndentLess, IndentMore, Italic, NumberedList, RemoveFormat, Separator, Source, StrikeThrough, Underline, Unlink, UnorderedList, AtomHtmlEditor, __decorate, __metadata, link, css;
+
+  function Toolbar(a, ...nodes) {
+    return XNode.create("div", {
+      class: "toolbar"
+    }, ...nodes);
+  }
+
+  function preventLinkClick(e, editor) {
+    let target = e.target;
+    const body = document.body;
+
+    while (target && target !== body) {
+      const ds = target.dataset;
+      const command = ds.command;
+
+      if (command) {
+        let commandParameter = ds.commandParameter;
+
+        if (!commandParameter) {
+          commandParameter = ds.commandParameters;
+
+          if (commandParameter) {
+            commandParameter = JSON.parse(commandParameter);
+          }
+        }
+
+        editor.dispatchEvent(new CustomEvent("click", {
+          bubbles: true
+        }));
+        editor.dispatchEvent(new CustomEvent("command", {
+          bubbles: true,
+          detail: {
+            target,
+            command,
+            commandParameter
+          }
+        }));
+        e.preventDefault();
+        return;
+      }
+
+      const click = ds.click;
+
+      if (click) {
+        editor.dispatchEvent(new CustomEvent("click", {
+          bubbles: true
+        }));
+        editor.dispatchEvent(new CustomEvent("htmlEditorClick", {
+          detail: {
+            target,
+            command: click
+          }
+        }));
+      }
+
+      if (target.isContentEditable) {
+        break;
+      }
+
+      if (target.tagName === "A") {
+        editor.dispatchEvent(new CustomEvent("click", {
+          bubbles: true
+        }));
+        e.preventDefault();
+        return false;
+      }
+
+      target = target.parentElement;
+    }
+  }
+
+  _export({
+    Toolbar: Toolbar,
+    default: void 0
+  });
+
+  return {
+    setters: [function (_webAtomsCoreDistCoreAtomBinder) {
+      AtomBinder = _webAtomsCoreDistCoreAtomBinder.AtomBinder;
+    }, function (_webAtomsCoreDistCoreBind) {
+      Bind = _webAtomsCoreDistCoreBind.default;
+    }, function (_webAtomsCoreDistCoreBindableProperty) {
+      BindableProperty = _webAtomsCoreDistCoreBindableProperty.BindableProperty;
+    }, function (_webAtomsCoreDistCoreColors) {
+      Colors = _webAtomsCoreDistCoreColors.default;
+    }, function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_webAtomsCoreDistStyleStyleRule) {
+      StyleRule = _webAtomsCoreDistStyleStyleRule.default;
+    }, function (_webAtomsCoreDistWebControlsAtomControl) {
+      AtomControl = _webAtomsCoreDistWebControlsAtomControl.AtomControl;
+    }, function (_webAtomsCoreDistWebStylesCSS) {
+      CSS = _webAtomsCoreDistWebStylesCSS.default;
+    }, function (_basicAtomRepeater) {
+      AtomRepeater = _basicAtomRepeater.default;
+    }, function (_commandsAddImage) {
+      AddImage = _commandsAddImage.default;
+      showImageDialog = _commandsAddImage.showImageDialog;
+    }, function (_commandsAddLink) {
+      AddLink = _commandsAddLink.default;
+    }, function (_commandsAlign) {
+      Align = _commandsAlign.default;
+    }, function (_commandsAttachFile) {
+      AttachFile = _commandsAttachFile.default;
+    }, function (_commandsBold) {
+      Bold = _commandsBold.default;
+    }, function (_commandsChangeColor) {
+      ChangeColor = _commandsChangeColor.default;
+    }, function (_commandsChangeFont) {
+      ChangeFont = _commandsChangeFont.default;
+    }, function (_commandsChangeFontSize) {
+      ChangeFontSize = _commandsChangeFontSize.default;
+    }, function (_commandsHeadings) {
+      Headings = _commandsHeadings.default;
+    }, function (_commandsHorizontalRule) {
+      HorizontalRule = _commandsHorizontalRule.default;
+    }, function (_commandsIndentLess) {
+      IndentLess = _commandsIndentLess.default;
+    }, function (_commandsIndentMore) {
+      IndentMore = _commandsIndentMore.default;
+    }, function (_commandsItalic) {
+      Italic = _commandsItalic.default;
+    }, function (_commandsNumberedList) {
+      NumberedList = _commandsNumberedList.default;
+    }, function (_commandsRemoveFormat) {
+      RemoveFormat = _commandsRemoveFormat.default;
+    }, function (_commandsSeparator) {
+      Separator = _commandsSeparator.default;
+    }, function (_commandsSource) {
+      Source = _commandsSource.default;
+    }, function (_commandsStrikeThrough) {
+      StrikeThrough = _commandsStrikeThrough.default;
+    }, function (_commandsUnderline) {
+      Underline = _commandsUnderline.default;
+    }, function (_commandsUnlink) {
+      Unlink = _commandsUnlink.default;
+    }, function (_commandsUnorderedList) {
+      UnorderedList = _commandsUnorderedList.default;
+    }],
+    execute: function () {
+      __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+        var c = arguments.length,
+            r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+            d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
+      };
+
+      __metadata = void 0 && (void 0).__metadata || function (k, v) {
+        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+      };
+
+      link = document.createElement("link");
+      link.href = "https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css";
+      link.rel = "stylesheet";
+      document.head.appendChild(link);
+      css = CSS(StyleRule().display("flex").flexDirection("column").minHeight(500).child(StyleRule("iframe").flexStretch()).child(StyleRule(".files").child(StyleRule(".file").flexLayout({
+        inline: true
+      }).borderColor(Colors.lightGray.withAlphaPercent(0.5)).borderWidth(1).borderStyle("solid").borderRadius(15).paddingLeft(10).paddingRight(10).child(StyleRule("label").maxWidth(100).textEllipsis()))).nested(StyleRule(".toolbar").display("flex").child(StyleRule(".command").display("inline-flex").justifyContent("space-evenly").border("none").cursor("pointer").backgroundColor(Colors.transparent).hoverBackgroundColor(Colors.lightGreen).minWidth(28).height(28).and(StyleRule(".pressed").backgroundColor(Colors.lightGray).hoverBackgroundColor(Colors.lightGreen)).nested(StyleRule(".ri-bold").fontWeight("bold")))));
+
+      _export("default", AtomHtmlEditor = class AtomHtmlEditor extends AtomControl {
+        get htmlContent() {
+          try {
+            return this.editor.innerHTML;
+          } catch (ex) {
+            console.warn(ex);
+          }
+        }
+
+        set htmlContent(v) {
+          this.editor.innerHTML = v;
+          AtomBinder.refreshValue(this, "htmlContent");
+        }
+
+        insertImage(s, e) {
+          return showImageDialog(s, e);
+        }
+
+        executeCommand(cmd, showUI, value) {
+          const r = this.editorDocument.execCommand(cmd, showUI, value);
+          setTimeout(() => this.version++, 1);
+          return r;
+        }
+
+        queryCommandState(cmd, ...a) {
+          return this.editorDocument.queryCommandState(cmd);
+        }
+
+        getStyle(name, v) {
+          try {
+            const node = this.editorWindow.getSelection().getRangeAt(0);
+            const e = node.startContainer.parentElement;
+            return this.editorWindow.getComputedStyle(e)[name];
+          } catch (ex) {
+            return null;
+          }
+        }
+
+        preCreate() {
+          this.version = 1;
+          this.files = [];
+          this.runAfterInit(() => {
+            this.setup();
+          });
+          this.element.classList.add(css);
+          this.element.classList.add("html-editor");
+        }
+
+        onPasteEvent(e) {
+          if (!e.clipboardData.types.find(x => x === "text/html")) {
+            return;
+          }
+
+          const d = e.clipboardData.getData("text/plain");
+
+          if (d) {
+            const s = window.getSelection();
+            const r = s.getRangeAt(0);
+            const p = document.createElement("p");
+            const span = document.createElement("span");
+            span.textContent = d;
+            p.appendChild(span);
+            r.insertNode(p);
+            r.setStartAfter(p);
+          }
+
+          e.preventDefault();
+        }
+
+        onInputEvent(e) {
+          console.log(e);
+        }
+
+        setup() {
+          const frame = this.element.getElementsByTagName("iframe")[0];
+          const doc = frame.contentWindow.document;
+          doc.open();
+          const baseUrl = `${location.protocol}//${location.host}`;
+          doc.writeln(`<base href="${baseUrl}"></base><div id="editor"><p>&nbsp;</p></div>`);
+          doc.close();
+          const style = doc.createElement("style");
+          style.textContent = `body {
+            font-family: arial,sans-serif
+        }
+        #editor {
+            min-height: 500px;
+        }
+        `;
+          doc.head.appendChild(style);
+          doc.body.addEventListener("click", e => preventLinkClick(e, this.element));
+          this.editor = doc.getElementById("editor");
+          this.editor.contentEditable = "true";
+          doc.execCommand("styleWithCSS");
+          doc.execCommand("insertBrOnReturn");
+
+          const updateVersion = () => setTimeout(() => {
+            this.version++;
+            AtomBinder.refreshValue(this, "htmlContent");
+            this.element.dispatchEvent(new CustomEvent("documentUpdated", {
+              detail: this.editor
+            }));
+            this.documentUpdated(this.editor);
+          }, 1);
+
+          this.editor.addEventListener("click", updateVersion);
+          this.editor.addEventListener("keydown", updateVersion);
+          this.editor.addEventListener("keypress", updateVersion);
+          this.editor.addEventListener("input", updateVersion);
+          this.editorWindow = frame.contentWindow;
+          this.editorDocument = doc;
+          updateVersion();
+          this.documentCreated(this.editor);
+          this.element.dispatchEvent(new CustomEvent("documentCreated", {
+            detail: this.editor
+          }));
+          this.registerDisposable({
+            dispose: () => {
+              this.editor.removeEventListener("click", updateVersion);
+              this.editor.removeEventListener("keydown", updateVersion);
+              this.editor.removeEventListener("keypress", updateVersion);
+              this.editor.removeEventListener("input", updateVersion);
+            }
+          });
+        }
+
+        documentCreated(e) {}
+
+        documentUpdated(e) {}
+
+        render(node, e, creator) {
+          this.render = super.render;
+
+          if (!node.children || node.children.length === 0) {
+            node.children[0] = XNode.create(Toolbar, null, XNode.create(Bold, null), XNode.create(Italic, null), XNode.create(Underline, null), XNode.create(StrikeThrough, null), XNode.create(Align, null), XNode.create(Separator, null), XNode.create(Headings, null), XNode.create(ChangeColor, null), XNode.create(HorizontalRule, null), XNode.create(Separator, null), XNode.create(ChangeFont, null), XNode.create(ChangeFontSize, null), XNode.create(Separator, null), XNode.create(NumberedList, null), XNode.create(UnorderedList, null), XNode.create(IndentLess, null), XNode.create(IndentMore, null), XNode.create(Separator, null), XNode.create(AddImage, null), XNode.create(AttachFile, null), XNode.create(Separator, null), XNode.create(AddLink, null), XNode.create(Unlink, null), XNode.create(RemoveFormat, null), XNode.create(Separator, null), XNode.create(Source, null));
+          }
+
+          super.render(XNode.create("div", Object.assign({}, node.attributes), ...node.children, XNode.create(AtomRepeater, {
+            class: "files",
+            "event-item-delete": ce => this.files.remove(ce.detail),
+            items: Bind.oneWay(() => this.files),
+            itemRenderer: file => XNode.create("div", {
+              class: "file"
+            }, XNode.create("i", {
+              class: "ri-attachment-2"
+            }), XNode.create("label", {
+              text: file.name
+            }), XNode.create("i", {
+              "data-click-event": "item-delete",
+              class: "ri-close-circle-fill"
+            }))
+          }), XNode.create("iframe", {
+            class: "editor-frame"
+          })));
+        }
+
+      });
+
+      __decorate([BindableProperty, __metadata("design:type", String)], AtomHtmlEditor.prototype, "content", void 0);
+
+      __decorate([BindableProperty, __metadata("design:type", Array)], AtomHtmlEditor.prototype, "header", void 0);
+
+      __decorate([BindableProperty, __metadata("design:type", Number)], AtomHtmlEditor.prototype, "version", void 0);
+
+      __decorate([BindableProperty, __metadata("design:type", Array)], AtomHtmlEditor.prototype, "files", void 0);
+    }
+  };
+});
+//# sourceMappingURL=AtomHtmlEditor.sys.js.map

package/dist/html-editor/AtomHtmlEditor.sys.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"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","names":["AtomHtmlEditor","Toolbar","a","nodes","XNode","class","preventLinkClick","e","editor","target","body","document","ds","dataset","command","commandParameter","commandParameters","JSON","parse","dispatchEvent","CustomEvent","bubbles","detail","preventDefault","click","isContentEditable","tagName","parentElement","AtomBinder","Bind","BindableProperty","Colors","StyleRule","AtomControl","CSS","AtomRepeater","AddImage","showImageDialog","AddLink","Align","AttachFile","Bold","ChangeColor","ChangeFont","ChangeFontSize","Headings","HorizontalRule","IndentLess","IndentMore","Italic","NumberedList","RemoveFormat","Separator","Source","StrikeThrough","Underline","Unlink","UnorderedList","link","createElement","href","rel","head","appendChild","css","display","flexDirection","minHeight","child","flexStretch","flexLayout","inline","borderColor","lightGray","withAlphaPercent","borderWidth","borderStyle","borderRadius","paddingLeft","paddingRight","maxWidth","textEllipsis","nested","justifyContent","border","cursor","backgroundColor","transparent","hoverBackgroundColor","lightGreen","minWidth","height","and","fontWeight","htmlContent","innerHTML","ex","console","warn","v","refreshValue","insertImage","s","executeCommand","cmd","showUI","value","r","editorDocument","execCommand","setTimeout","version","queryCommandState","getStyle","name","node","editorWindow","getSelection","getRangeAt","startContainer","getComputedStyle","preCreate","files","runAfterInit","setup","element","classList","add","onPasteEvent","clipboardData","types","find","x","d","getData","window","p","span","textContent","insertNode","setStartAfter","onInputEvent","log","frame","getElementsByTagName","doc","contentWindow","open","baseUrl","location","protocol","host","writeln","close","style","addEventListener","getElementById","contentEditable","updateVersion","documentUpdated","documentCreated","registerDisposable","dispose","removeEventListener","render","creator","children","length","attributes","ce","remove","items","oneWay","itemRenderer","file","text","__decorate"],"sourceRoot":"","sources":["../../src/html-editor/AtomHtmlEditor.tsx"],"sourcesContent":[null]}

package/dist/html-editor/commands/AddImage.sys.js

@@ -0,0 +1,96 @@
+System.register(["@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/BindableProperty", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/web/services/PopupService", "../../basic/FormField", "./CommandButton", "./HtmlCommands"], function (_export, _context) {
+  "use strict";
+
+  var Bind, BindableProperty, XNode, PopupService, PopupWindow, FormField, CommandButton, HtmlCommands, ImageDialog, __decorate, __metadata;
+
+  function showImageDialog(s, e) {
+    return PopupService.showWindow(e.currentTarget, ImageDialog, {
+      title: "Add Image"
+    });
+  }
+
+  function AddImage({
+    eventInsertHtml = (s, e) => s.insertImage(s, e),
+    insertCommand = HtmlCommands.insertImage
+  }) {
+    return CommandButton({
+      icon: "ri-image-add-fill",
+      insertCommand,
+      disabled: false,
+      title: "Insert Image",
+      eventInsertHtml
+    });
+  }
+
+  _export({
+    showImageDialog: showImageDialog,
+    default: AddImage
+  });
+
+  return {
+    setters: [function (_webAtomsCoreDistCoreBind) {
+      Bind = _webAtomsCoreDistCoreBind.default;
+    }, function (_webAtomsCoreDistCoreBindableProperty) {
+      BindableProperty = _webAtomsCoreDistCoreBindableProperty.BindableProperty;
+    }, function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_webAtomsCoreDistWebServicesPopupService) {
+      PopupService = _webAtomsCoreDistWebServicesPopupService.default;
+      PopupWindow = _webAtomsCoreDistWebServicesPopupService.PopupWindow;
+    }, function (_basicFormField) {
+      FormField = _basicFormField.default;
+    }, function (_CommandButton) {
+      CommandButton = _CommandButton.default;
+    }, function (_HtmlCommands) {
+      HtmlCommands = _HtmlCommands.default;
+    }],
+    execute: function () {
+      __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+        var c = arguments.length,
+            r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+            d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
+      };
+
+      __metadata = void 0 && (void 0).__metadata || function (k, v) {
+        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+      };
+
+      ImageDialog = class ImageDialog extends PopupWindow {
+        create() {
+          this.link = "";
+          this.alt = "";
+          this.render(XNode.create("div", null, XNode.create(FormField, {
+            label: "Url"
+          }, XNode.create("input", {
+            value: Bind.twoWaysImmediate(() => this.link)
+          })), XNode.create(FormField, {
+            label: "Alt"
+          }, XNode.create("input", {
+            value: Bind.twoWaysImmediate(() => this.alt)
+          })), XNode.create("div", {
+            class: "command-bar"
+          }, XNode.create("button", {
+            eventClick: () => this.close(this.createImage()),
+            text: "Add"
+          }))));
+        }
+
+        createImage() {
+          if (this.alt) {
+            return `<img src="${this.link}" alt="${this.alt}" />`;
+          }
+
+          return `<img src="${this.link}"/>`;
+        }
+
+      };
+
+      __decorate([BindableProperty, __metadata("design:type", String)], ImageDialog.prototype, "link", void 0);
+
+      __decorate([BindableProperty, __metadata("design:type", String)], ImageDialog.prototype, "alt", void 0);
+    }
+  };
+});
+//# sourceMappingURL=AddImage.sys.js.map

package/dist/html-editor/commands/AddImage.sys.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":";;;wGASMA,W;;EAkCA,SAAUC,eAAV,CAA0BC,CAA1B,EAA6CC,CAA7C,EAAqD;IACvD,OAAOC,YAAY,CAACC,UAAb,CAAgCF,CAAC,CAACG,aAAlC,EAAgEN,WAAhE,EAA6E;MAAEO,KAAK,EAAE;IAAT,CAA7E,CAAP;EACH;;EAEa,SAAUC,QAAV,CAAmB;IAC7BC,eAAe,GAAG,CAACP,CAAD,EAAoBC,CAApB,KAAiCD,CAAC,CAACQ,WAAF,CAAcR,CAAd,EAAiBC,CAAjB,CADtB;IAE7BQ,aAAa,GAAGC,YAAY,CAACF;EAFA,CAAnB,EAGb;IACG,OAAOG,aAAa,CAAC;MACjBC,IAAI,EAAE,mBADW;MAEjBH,aAFiB;MAGjBI,QAAQ,EAAE,KAHO;MAIjBR,KAAK,EAAE,cAJU;MAKjBE;IALiB,CAAD,CAApB;EAOH;;;qBAfeR,e;aAIQO;;;;;MA/CjBQ,I;;MACEC,gB,yCAAAA,gB;;MACFC,K;;MACAd,Y;MAAgBe,W,4CAAAA,W;;MAChBC,S;;MAEAP,a;;MACAD,Y;;;;;;;;;;;;;;;MAEDZ,W,GAAN,MAAMA,WAAN,SAA0BmB,WAA1B,CAAqC;QAQvBE,MAAM;UACZ,KAAKC,IAAL,GAAY,EAAZ;UACA,KAAKC,GAAL,GAAW,EAAX;UACA,KAAKC,MAAL,CAAYN,0BACRA,aAACE,SAAD,EAAU;YAACK,KAAK,EAAC;UAAP,CAAV,EACIP;YAAOQ,KAAK,EAAEV,IAAI,CAACW,gBAAL,CAAsB,MAAM,KAAKL,IAAjC;UAAd,EADJ,CADQ,EAIRJ,aAACE,SAAD,EAAU;YAACK,KAAK,EAAC;UAAP,CAAV,EACIP;YAAOQ,KAAK,EAAEV,IAAI,CAACW,gBAAL,CAAsB,MAAM,KAAKJ,GAAjC;UAAd,EADJ,CAJQ,EAORL;YAAKU,KAAK,EAAC;UAAX,GACIV;YACIW,UAAU,EAAE,MAAM,KAAKC,KAAL,CAAW,KAAKC,WAAL,EAAX,CADtB;YAEIC,IAAI,EAAC;UAFT,EADJ,CAPQ,CAAZ;QAaH;;QAEOD,WAAW;UACf,IAAI,KAAKR,GAAT,EAAc;YACV,OAAO,aAAa,KAAKD,IAAI,UAAU,KAAKC,GAAG,MAA/C;UACH;;UACD,OAAO,aAAa,KAAKD,IAAI,KAA7B;QACH;;MA/BgC,C;;MAGjCW,YADChB,gBACD;;MAGAgB,YADChB,gBACD","names":["ImageDialog","showImageDialog","s","e","PopupService","showWindow","currentTarget","title","AddImage","eventInsertHtml","insertImage","insertCommand","HtmlCommands","CommandButton","icon","disabled","Bind","BindableProperty","XNode","PopupWindow","FormField","create","link","alt","render","label","value","twoWaysImmediate","class","eventClick","close","createImage","text","__decorate"],"sourceRoot":"","sources":["../../../src/html-editor/commands/AddImage.tsx"],"sourcesContent":[null]}

package/dist/html-editor/commands/AddLink.sys.js

@@ -0,0 +1,114 @@
+System.register(["@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/BindableProperty", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/style/StyleRule", "@web-atoms/core/dist/web/controls/AtomToggleButtonBar", "@web-atoms/core/dist/web/services/PopupService", "@web-atoms/core/dist/web/styles/CSS", "../../basic/FormField", "./CommandButton", "./HtmlCommands"], function (_export, _context) {
+  "use strict";
+
+  var Bind, BindableProperty, XNode, StyleRule, AtomToggleButtonBar, PopupService, PopupWindow, CSS, FormField, CommandButton, HtmlCommands, LinkDialog, __decorate, __metadata, linkTypes, linkDialogCss;
+
+  function showDialog(s, e) {
+    return PopupService.showWindow(s.element, LinkDialog);
+  }
+
+  function AddLink({
+    insertCommand = HtmlCommands.createLink
+  }) {
+    return CommandButton({
+      icon: "ri-link-m",
+      insertCommand,
+      disabled: false,
+      eventInsertHtml: showDialog,
+      title: "Create Hyper Link"
+    });
+  }
+
+  _export("default", AddLink);
+
+  return {
+    setters: [function (_webAtomsCoreDistCoreBind) {
+      Bind = _webAtomsCoreDistCoreBind.default;
+    }, function (_webAtomsCoreDistCoreBindableProperty) {
+      BindableProperty = _webAtomsCoreDistCoreBindableProperty.BindableProperty;
+    }, function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_webAtomsCoreDistStyleStyleRule) {
+      StyleRule = _webAtomsCoreDistStyleStyleRule.default;
+    }, function (_webAtomsCoreDistWebControlsAtomToggleButtonBar) {
+      AtomToggleButtonBar = _webAtomsCoreDistWebControlsAtomToggleButtonBar.AtomToggleButtonBar;
+    }, function (_webAtomsCoreDistWebServicesPopupService) {
+      PopupService = _webAtomsCoreDistWebServicesPopupService.default;
+      PopupWindow = _webAtomsCoreDistWebServicesPopupService.PopupWindow;
+    }, function (_webAtomsCoreDistWebStylesCSS) {
+      CSS = _webAtomsCoreDistWebStylesCSS.default;
+    }, function (_basicFormField) {
+      FormField = _basicFormField.default;
+    }, function (_CommandButton) {
+      CommandButton = _CommandButton.default;
+    }, function (_HtmlCommands) {
+      HtmlCommands = _HtmlCommands.default;
+    }],
+    execute: function () {
+      __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+        var c = arguments.length,
+            r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+            d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
+      };
+
+      __metadata = void 0 && (void 0).__metadata || function (k, v) {
+        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+      };
+
+      linkTypes = [{
+        label: "Web Page",
+        value: "web-page"
+      }, {
+        label: "Email",
+        value: "email"
+      }, {
+        label: "Anchor",
+        value: "anchor"
+      }, {
+        label: "Phone",
+        value: "phone"
+      }];
+      linkDialogCss = CSS(StyleRule().display("flex").flexDirection("column").gap(5));
+      LinkDialog = class LinkDialog extends PopupWindow {
+        create() {
+          this.type = "web-page";
+          this.title = "Create Link";
+          this.render(XNode.create("div", {
+            class: linkDialogCss
+          }, XNode.create(FormField, {
+            label: "Type"
+          }, XNode.create(AtomToggleButtonBar, {
+            items: linkTypes,
+            value: Bind.twoWays(() => this.type)
+          })), XNode.create(FormField, {
+            label: "Link",
+            required: true
+          }, XNode.create("input", {
+            placeholder: "https://...",
+            value: Bind.twoWaysImmediate(() => this.link)
+          })), XNode.create("div", {
+            class: "command-bar"
+          }, XNode.create("button", {
+            text: "Add",
+            eventClick: Bind.event(() => this.close(this.toLink(this.link)))
+          }))));
+        }
+
+        toLink(link) {
+          switch (this.type) {
+            case "web-page":
+              return /^(http|https)\:\/\//.test(link) ? link : `http://${link}`;
+          }
+        }
+
+      };
+
+      __decorate([BindableProperty, __metadata("design:type", String)], LinkDialog.prototype, "link", void 0);
+
+      __decorate([BindableProperty, __metadata("design:type", String)], LinkDialog.prototype, "type", void 0);
+    }
+  };
+});
+//# sourceMappingURL=AddLink.sys.js.map

package/dist/html-editor/commands/AddLink.sys.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":";;;6IAsCMA,U;;EAsCN,SAASC,UAAT,CAAoBC,CAApB,EAAuCC,CAAvC,EAA+C;IAC3C,OAAOC,YAAY,CAACC,UAAb,CAAwBH,CAAC,CAACI,OAA1B,EAAmCN,UAAnC,CAAP;EACH;;EAEa,SAAUO,OAAV,CAAkB;IAC5BC,aAAa,GAAGC,YAAY,CAACC;EADD,CAAlB,EAEb;IACG,OAAOC,aAAa,CAAC;MACjBC,IAAI,EAAE,WADW;MAEjBJ,aAFiB;MAGjBK,QAAQ,EAAE,KAHO;MAIjBC,eAAe,EAAEb,UAJA;MAKjBc,KAAK,EAAE;IALU,CAAD,CAApB;EAOH;;qBAVuBR,O;;;;MAhFjBS,I;;MACEC,gB,yCAAAA,gB;;MAEFC,K;;MACAC,S;;MACEC,mB,mDAAAA,mB;;MACFhB,Y;MAAgBiB,W,4CAAAA,W;;MAChBC,G;;MACAC,S;;MAEAZ,a;;MACAF,Y;;;;;;;;;;;;;;;MAEDe,S,GAAY,CACd;QACIC,KAAK,EAAE,UADX;QAEIC,KAAK,EAAE;MAFX,CADc,EAKd;QACID,KAAK,EAAE,OADX;QAEIC,KAAK,EAAE;MAFX,CALc,EASd;QACID,KAAK,EAAE,QADX;QAEIC,KAAK,EAAE;MAFX,CATc,EAad;QACID,KAAK,EAAE,OADX;QAEIC,KAAK,EAAE;MAFX,CAbc,C;MAmBZC,a,GAAgBL,GAAG,CAACH,SAAS,GAC9BS,OADqB,CACb,MADa,EAErBC,aAFqB,CAEP,QAFO,EAGrBC,GAHqB,CAGjB,CAHiB,CAAD,C;MAMnB9B,U,GAAN,MAAMA,UAAN,SAAyBqB,WAAzB,CAAoC;QAQtBU,MAAM;UACZ,KAAKC,IAAL,GAAY,UAAZ;UACA,KAAKjB,KAAL,GAAa,aAAb;UACA,KAAKkB,MAAL,CAAYf;YAAKgB,KAAK,EAAEP;UAAZ,GACRT,aAACK,SAAD,EAAU;YAACE,KAAK,EAAC;UAAP,CAAV,EACIP,aAACE,mBAAD,EAAoB;YAChBe,KAAK,EAAEX,SADS;YAEhBE,KAAK,EAAEV,IAAI,CAACoB,OAAL,CAAa,MAAM,KAAKJ,IAAxB;UAFS,CAApB,CADJ,CADQ,EAMRd,aAACK,SAAD,EAAU;YAACE,KAAK,EAAC,MAAP;YAAcY,QAAQ,EAAE;UAAxB,CAAV,EACInB;YACIoB,WAAW,EAAC,aADhB;YAEIZ,KAAK,EAAEV,IAAI,CAACuB,gBAAL,CAAsB,MAAM,KAAKC,IAAjC;UAFX,EADJ,CANQ,EAWRtB;YAAKgB,KAAK,EAAC;UAAX,GACIhB;YACIuB,IAAI,EAAC,KADT;YAEIC,UAAU,EAAE1B,IAAI,CAAC2B,KAAL,CAAW,MAAM,KAAKC,KAAL,CAAW,KAAKC,MAAL,CAAY,KAAKL,IAAjB,CAAX,CAAjB;UAFhB,EADJ,CAXQ,CAAZ;QAiBH;;QAEOK,MAAM,CAACL,IAAD,EAAa;UACvB,QAAQ,KAAKR,IAAb;YACI,KAAK,UAAL;cACI,OAAO,sBAAsBc,IAAtB,CAA2BN,IAA3B,IAAmCA,IAAnC,GAA0C,UAAUA,IAAI,EAA/D;UAFR;QAIH;;MAnC+B,C;;MAGhCO,YADC9B,gBACD;;MAGA8B,YADC9B,gBACD","names":["LinkDialog","showDialog","s","e","PopupService","showWindow","element","AddLink","insertCommand","HtmlCommands","createLink","CommandButton","icon","disabled","eventInsertHtml","title","Bind","BindableProperty","XNode","StyleRule","AtomToggleButtonBar","PopupWindow","CSS","FormField","linkTypes","label","value","linkDialogCss","display","flexDirection","gap","create","type","render","class","items","twoWays","required","placeholder","twoWaysImmediate","link","text","eventClick","event","close","toLink","test","__decorate"],"sourceRoot":"","sources":["../../../src/html-editor/commands/AddLink.tsx"],"sourcesContent":[null]}

package/dist/html-editor/commands/Align.sys.js

@@ -0,0 +1,44 @@
+System.register(["@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/XNode", "../../basic/PopupButton"], function (_export, _context) {
+  "use strict";
+
+  var Bind, XNode, PopupButton, MenuItem;
+
+  function Align() {
+    return XNode.create(PopupButton, {
+      class: "command",
+      icon: "ri-align-left",
+      title: "Change Alignment"
+    }, XNode.create(MenuItem, {
+      icon: "ri-align-left",
+      title: "Align Left",
+      eventClick: Bind.event(e => e.executeCommand("justifyLeft"))
+    }), XNode.create(MenuItem, {
+      icon: "ri-align-center",
+      title: "Align Center",
+      eventClick: Bind.event(e => e.executeCommand("justifyCenter"))
+    }), XNode.create(MenuItem, {
+      icon: "ri-align-right",
+      title: "Align Right",
+      eventClick: Bind.event(e => e.executeCommand("justifyRight"))
+    }), XNode.create(MenuItem, {
+      icon: "ri-align-justify",
+      title: "Justify",
+      eventClick: Bind.event(e => e.executeCommand("justifyFull"))
+    }));
+  }
+
+  _export("default", Align);
+
+  return {
+    setters: [function (_webAtomsCoreDistCoreBind) {
+      Bind = _webAtomsCoreDistCoreBind.default;
+    }, function (_webAtomsCoreDistCoreXNode) {
+      XNode = _webAtomsCoreDistCoreXNode.default;
+    }, function (_basicPopupButton) {
+      PopupButton = _basicPopupButton.default;
+      MenuItem = _basicPopupButton.MenuItem;
+    }],
+    execute: function () {}
+  };
+});
+//# sourceMappingURL=Align.sys.js.map

package/dist/html-editor/commands/Align.sys.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":";;;;;EAKc,SAAUA,KAAV,GAAe;IACzB,OAAOC,aAACC,WAAD,EAAY;MACfC,KAAK,EAAC,SADS;MAEfC,IAAI,EAAC,eAFU;MAGfC,KAAK,EAAC;IAHS,CAAZ,EAIHJ,aAACK,QAAD,EAAS;MACLF,IAAI,EAAC,eADA;MAELC,KAAK,EAAC,YAFD;MAGLE,UAAU,EAAEC,IAAI,CAACC,KAAL,CAAYC,CAAD,IACnBA,CAAC,CAACC,cAAF,CAAiB,aAAjB,CADQ;IAHP,CAAT,CAJG,EASHV,aAACK,QAAD,EAAS;MACLF,IAAI,EAAC,iBADA;MAELC,KAAK,EAAC,cAFD;MAGLE,UAAU,EAAEC,IAAI,CAACC,KAAL,CAAYC,CAAD,IACnBA,CAAC,CAACC,cAAF,CAAiB,eAAjB,CADQ;IAHP,CAAT,CATG,EAcHV,aAACK,QAAD,EAAS;MACLF,IAAI,EAAC,gBADA;MAELC,KAAK,EAAC,aAFD;MAGLE,UAAU,EAAEC,IAAI,CAACC,KAAL,CAAYC,CAAD,IACnBA,CAAC,CAACC,cAAF,CAAiB,cAAjB,CADQ;IAHP,CAAT,CAdG,EAmBHV,aAACK,QAAD,EAAS;MACLF,IAAI,EAAC,kBADA;MAELC,KAAK,EAAC,SAFD;MAGLE,UAAU,EAAEC,IAAI,CAACC,KAAL,CAAYC,CAAD,IACnBA,CAAC,CAACC,cAAF,CAAiB,aAAjB,CADQ;IAHP,CAAT,CAnBG,CAAP;EAyBH;;qBA1BuBX,K;;;;MALjBQ,I;;MACAP,K;;MACAC,W;MAAeI,Q,qBAAAA,Q","names":["Align","XNode","PopupButton","class","icon","title","MenuItem","eventClick","Bind","event","e","executeCommand"],"sourceRoot":"","sources":["../../../src/html-editor/commands/Align.tsx"],"sourcesContent":[null]}