@stratusjs/angular 0.7.3 → 0.7.5

package/dist/angular.bundle.js

@@ -1,6 +1,6 @@
-System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/environment', '@stratusjs/core/misc', '@stratusjs/angularjs/services/model', '@stratusjs/angularjs/services/registry', '@stratusjs/core/events/eventManager', 'html2pdf', 'font-awesome', 'froala-plugins', 'froala-embedly', 'froala-font-awesome', 'froala-image-tui', 'froala-editor', '@stratusjs/core/datastore/xhr', '@agentepsilon/decko', 'toastify-js', '@stratusjs/angularjs/services/collection', 'zone.js/dist/zone'], (function (exports) {
+System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/environment', '@stratusjs/core/misc', '@stratusjs/angularjs/services/model', '@stratusjs/angularjs/services/registry', '@stratusjs/core/events/eventManager', 'html2pdf', 'font-awesome', 'froala-plugins', 'froala-embedly', 'froala-font-awesome', 'froala-image-tui', 'froala-editor', '@stratusjs/core/datastore/xhr', '@agentepsilon/decko', '@stratusjs/angular/core/root.component', 'toastify-js', '@stratusjs/angularjs/services/collection', 'zone.js/dist/zone'], (function (exports) {
     'use strict';
-    var Stratus, _, uniqueId$3, snakeCase, head, isEmpty, isUndefined, isString, extend$1, debounce$2, isNumber, isBoolean, isArray$1, clone, isFunction$1, set, isNil, includes, isObject$2, assignIn, forEach, cookie, isJSON, safeUniqueId, Model, Registry, EventManager$1, FroalaEditor, XHR, debounce$1, Toastify, Collection;
+    var Stratus, _, uniqueId$3, snakeCase, head, isEmpty, isUndefined, isString, extend$1, debounce$2, isNumber, isBoolean, isArray$1, clone, isFunction$1, set, isNil, includes, isObject$2, assignIn, forEach, cookie, isJSON, safeUniqueId, Model, Registry, EventManager$1, FroalaEditor, XHR, debounce$1, RootComponent$1, Toastify, Collection;
     return {
         setters: [function (module) {
             Stratus = module.Stratus;
@@ -42,6 +42,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             XHR = module.XHR;
         }, function (module) {
             debounce$1 = module.debounce;
+        }, function (module) {
+            RootComponent$1 = module.RootComponent;
         }, function (module) {
             Toastify = module["default"];
         }, function (module) {
@@ -56675,8 +56677,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemDir$c = '@stratusjs/angular';
             const moduleName$d = 'citation-dialog';
             const parentModuleName$6 = 'editor';
-            const min$g = !cookie('env') ? '.min' : '';
-            const localDir$h = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$c}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$h = !cookie('env') ? '.min' : '';
+            const localDir$i = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$c}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let CitationDialogComponent = exports('CitationDialogComponent', class CitationDialogComponent extends ResponsiveComponent {
                 constructor(dialogRef, data, fb, snackBar, iconRegistry, sanitizer, ref) {
                     super();
@@ -56698,7 +56700,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 ngOnInit() {
                     this.uid = uniqueId$3(`sa_${snakeCase(moduleName$d)}_component_`);
                     Stratus.Instances[this.uid] = this;
-                    Stratus.Internals.CssLoader(`${localDir$h}${parentModuleName$6}/${moduleName$d}.component${min$g}.css`);
+                    Stratus.Internals.CssLoader(`${localDir$i}${parentModuleName$6}/${moduleName$d}.component${min$h}.css`);
                     this.model = this.data.model;
                     this.property = this.data.property;
                     this.editor = this.data.editor;
@@ -56816,7 +56818,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('CitationDialogComponent', CitationDialogComponent = __decorate$p([
                 Component({
                     selector: `sa-${moduleName$d}`,
-                    templateUrl: `${localDir$h}/${parentModuleName$6}/${moduleName$d}.component${min$g}.html`,
+                    templateUrl: `${localDir$i}/${parentModuleName$6}/${moduleName$d}.component${min$h}.html`,
                 }),
                 __param$7(1, Inject(MAT_DIALOG_DATA)),
                 __metadata$l("design:paramtypes", [MatDialogRef, Object, FormBuilder,
@@ -56903,8 +56905,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemDir$b = '@stratusjs/angular';
             const moduleName$c = 'link-dialog';
             const parentModuleName$5 = 'editor';
-            const min$f = !cookie('env') ? '.min' : '';
-            const localDir$g = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$b}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$g = !cookie('env') ? '.min' : '';
+            const localDir$h = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$b}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let LinkDialogComponent = exports('LinkDialogComponent', class LinkDialogComponent extends ResponsiveComponent {
                 constructor(dialogRef, data, fb, backend, snackBar, iconRegistry, sanitizer, ref) {
                     super();
@@ -56940,7 +56942,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 ngOnInit() {
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$c)}_component_`);
                     Stratus.Instances[this.uid] = this;
-                    Stratus.Internals.CssLoader(`${localDir$g}${parentModuleName$5}/${moduleName$c}.component${min$f}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$h}${parentModuleName$5}/${moduleName$c}.component${min$g}.css`)
                         .then(() => {
                         this.isStyled = true;
                         this.refresh();
@@ -57230,7 +57232,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('LinkDialogComponent', LinkDialogComponent = __decorate$n([
                 Component({
                     selector: `sa-${moduleName$c}`,
-                    templateUrl: `${localDir$g}/${parentModuleName$5}/${moduleName$c}.component${min$f}.html`,
+                    templateUrl: `${localDir$h}/${parentModuleName$5}/${moduleName$c}.component${min$g}.html`,
                 }),
                 __param$6(1, Inject(MAT_DIALOG_DATA)),
                 __metadata$j("design:paramtypes", [MatDialogRef, Object, FormBuilder,
@@ -57256,8 +57258,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemDir$a = '@stratusjs/angular';
             const moduleName$b = 'media-dialog';
             const parentModuleName$4 = 'editor';
-            const min$e = !cookie('env') ? '.min' : '';
-            const localDir$f = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$a}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$f = !cookie('env') ? '.min' : '';
+            const localDir$g = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$a}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let MediaDialogComponent = exports('MediaDialogComponent', class MediaDialogComponent extends ResponsiveComponent {
                 constructor(dialogRef, data, fb, backend, snackBar, ref) {
                     super();
@@ -57281,7 +57283,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 ngOnInit() {
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$b)}_component_`);
                     Stratus.Instances[this.uid] = this;
-                    Stratus.Internals.CssLoader(`${localDir$f}/${parentModuleName$4}/${moduleName$b}.component${min$e}.css`);
+                    Stratus.Internals.CssLoader(`${localDir$g}/${parentModuleName$4}/${moduleName$b}.component${min$f}.css`);
                     this.model = this.data.model;
                     this.property = this.data.property;
                     this.editor = this.data.editor;
@@ -57520,7 +57522,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('MediaDialogComponent', MediaDialogComponent = __decorate$m([
                 Component({
                     selector: `sa-${moduleName$b}`,
-                    templateUrl: `${localDir$f}/${parentModuleName$4}/${moduleName$b}.component${min$e}.html`,
+                    templateUrl: `${localDir$g}/${parentModuleName$4}/${moduleName$b}.component${min$f}.html`,
                 }),
                 __param$5(1, Inject(MAT_DIALOG_DATA)),
                 __metadata$i("design:paramtypes", [MatDialogRef, Object, FormBuilder,
@@ -57959,8 +57961,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemDir$9 = '@stratusjs/angular';
             const moduleName$a = 'code-view-dialog';
             const parentModuleName$3 = 'editor';
-            const min$d = !cookie('env') ? '.min' : '';
-            const localDir$e = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$9}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$e = !cookie('env') ? '.min' : '';
+            const localDir$f = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$9}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let CodeViewDialogComponent = exports('CodeViewDialogComponent', class CodeViewDialogComponent extends ResponsiveComponent {
                 constructor(dialogRef, data, ref, fb, ngZone) {
                     super();
@@ -57983,7 +57985,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 ngOnInit() {
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$a)}_component_`);
                     Stratus.Instances[this.uid] = this;
-                    Stratus.Internals.CssLoader(`${localDir$e}/${parentModuleName$3}/${moduleName$a}.component${min$d}.css`);
+                    Stratus.Internals.CssLoader(`${localDir$f}/${parentModuleName$3}/${moduleName$a}.component${min$e}.css`);
                     this.model = this.data.model;
                     this.property = this.data.property;
                     const dataControl = this.form.get('dataString');
@@ -58015,7 +58017,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('CodeViewDialogComponent', CodeViewDialogComponent = __decorate$l([
                 Component({
                     selector: `sa-${moduleName$a}`,
-                    templateUrl: `${localDir$e}/${parentModuleName$3}/${moduleName$a}.component${min$d}.html`,
+                    templateUrl: `${localDir$f}/${parentModuleName$3}/${moduleName$a}.component${min$e}.html`,
                 }),
                 __param$4(1, Inject(MAT_DIALOG_DATA)),
                 __metadata$h("design:paramtypes", [MatDialogRef, Object, ChangeDetectorRef,
@@ -80895,8 +80897,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemDir$8 = '@stratusjs/angular';
             const moduleName$9 = 'citationManager';
             const parentModuleName$2 = 'froala/plugins';
-            const min$c = !cookie('env') ? '.min' : '';
-            const localDir$d = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$8}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$d = !cookie('env') ? '.min' : '';
+            const localDir$e = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$8}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             extend$1(FroalaEditor.POPUP_TEMPLATES, {
                 'citationManager.toolbar': '[_BUTTONS_]'
             });
@@ -80907,7 +80909,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 let inputButton;
                 const debug = false;
                 function _init() {
-                    Stratus.Internals.CssLoader(`${localDir$d}${parentModuleName$2}/${moduleName$9}${min$c}.css`);
+                    Stratus.Internals.CssLoader(`${localDir$e}${parentModuleName$2}/${moduleName$9}${min$d}.css`);
                     inputButton = new InputButtonPlugin({
                         name: 'Citation Manager',
                         eventName: 'citation-input',
@@ -84648,8 +84650,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemPackage = '@stratusjs/angular';
             const froalaPackage = 'froala-editor';
             const moduleName$8 = 'editor';
-            const min$b = !cookie('env') ? '.min' : '';
-            const localDir$c = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemPackage}/*`].replace(/[^\/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$c = !cookie('env') ? '.min' : '';
+            const localDir$d = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemPackage}/*`].replace(/[^\/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             const froalaDir = `${Stratus.BaseUrl}${boot.configuration.paths[froalaPackage].replace(/js\/[^\/]*$/, '')}`;
             const has$2 = (object, path) => _.has(object, path) && !_.isEmpty(_.get(object, path));
             let EditorComponent = exports('EditorComponent', class EditorComponent extends RootComponent {
@@ -85190,12 +85192,12 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$8)}_component_`);
                     Stratus.Instances[this.uid] = this;
                     Stratus.Internals.LoadCss([
-                        `${localDir$c}${moduleName$8}/${moduleName$8}.component${min$b}.css`,
-                        `${froalaDir}css/froala_editor.pkgd${min$b}.css`,
-                        `${froalaDir}css/themes/dark${min$b}.css`,
-                        `${froalaDir}css/third_party/embedly${min$b}.css`,
-                        `${froalaDir}css/third_party/font_awesome${min$b}.css`,
-                        `${froalaDir}css/third_party/image_tui${min$b}.css`,
+                        `${localDir$d}${moduleName$8}/${moduleName$8}.component${min$c}.css`,
+                        `${froalaDir}css/froala_editor.pkgd${min$c}.css`,
+                        `${froalaDir}css/themes/dark${min$c}.css`,
+                        `${froalaDir}css/third_party/embedly${min$c}.css`,
+                        `${froalaDir}css/third_party/font_awesome${min$c}.css`,
+                        `${froalaDir}css/third_party/image_tui${min$c}.css`,
                     ]).then(() => {
                         this.styled = true;
                         this.refresh();
@@ -85598,7 +85600,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('EditorComponent', EditorComponent = __decorate$k([
                 Component({
                     selector: `sa-${moduleName$8}`,
-                    templateUrl: `${localDir$c}/${moduleName$8}/${moduleName$8}.component${min$b}.html`,
+                    templateUrl: `${localDir$d}/${moduleName$8}/${moduleName$8}.component${min$c}.html`,
                 }),
                 __metadata$g("design:paramtypes", [DomSanitizer,
                     ChangeDetectorRef,
@@ -122930,8 +122932,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             };
             const systemDir$7 = '@stratusjs/angular';
             const moduleName$7 = 'base';
-            const min$a = !cookie('env') ? '.min' : '';
-            const localDir$b = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$7}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$b = !cookie('env') ? '.min' : '';
+            const localDir$c = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$7}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let BaseComponent = exports('BaseComponent', class BaseComponent extends RootComponent {
                 constructor(sanitizer, ref, elementRef) {
                     super();
@@ -123008,7 +123010,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('BaseComponent', BaseComponent = __decorate$h([
                 Component({
                     selector: 'sa-base',
-                    templateUrl: `${localDir$b}/${moduleName$7}/${moduleName$7}.component${min$a}.html`,
+                    templateUrl: `${localDir$c}/${moduleName$7}/${moduleName$7}.component${min$b}.html`,
                 }),
                 __metadata$f("design:paramtypes", [DomSanitizer,
                     ChangeDetectorRef,
@@ -123029,8 +123031,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             };
             const systemDir$6 = '@stratusjs/angular';
             const moduleName$6 = 'confirm-dialog';
-            const min$9 = !cookie('env') ? '.min' : '';
-            const localDir$a = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$6}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$a = !cookie('env') ? '.min' : '';
+            const localDir$b = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$6}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let ConfirmDialogComponent = exports('ConfirmDialogComponent', class ConfirmDialogComponent {
                 constructor(dialogRef, data) {
                     this.dialogRef = dialogRef;
@@ -123046,7 +123048,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('ConfirmDialogComponent', ConfirmDialogComponent = __decorate$g([
                 Component({
                     selector: `sa-${moduleName$6}`,
-                    templateUrl: `${localDir$a}/${moduleName$6}/${moduleName$6}.component${min$9}.html`,
+                    templateUrl: `${localDir$b}/${moduleName$6}/${moduleName$6}.component${min$a}.html`,
                 }),
                 __param$3(1, Inject(MAT_DIALOG_DATA)),
                 __metadata$e("design:paramtypes", [MatDialogRef, Object])
@@ -123063,8 +123065,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             };
             const systemDir$5 = '@stratusjs/angular';
             const moduleName$5 = 'media-selector';
-            const min$8 = !cookie('env') ? '.min' : '';
-            const localDir$9 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$5}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$9 = !cookie('env') ? '.min' : '';
+            const localDir$a = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$5}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             const has$1 = (object, path) => _.has(object, path) && !_.isEmpty(_.get(object, path));
             let MediaSelectorComponent = exports('MediaSelectorComponent', class MediaSelectorComponent extends RootComponent {
                 constructor(iconRegistry, sanitizer, ref, elementRef, viewportRuler) {
@@ -123135,7 +123137,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         media_selector_audio: `${Stratus.BaseUrl}sitetheorymedia/images/mediaTypeIcons/media-icon-audio.svg`,
                         media_selector_document: `${Stratus.BaseUrl}sitetheorymedia/images/mediaTypeIcons/media-icon-document.svg`
                     }, (value, key) => iconRegistry.addSvgIcon(key, sanitizer.bypassSecurityTrustResourceUrl(value)).getNamedSvgIcon(key));
-                    Stratus.Internals.CssLoader(`${localDir$9}${moduleName$5}/${moduleName$5}.component${min$8}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$a}${moduleName$5}/${moduleName$5}.component${min$9}.css`)
                         .then(() => {
                         this.styled = true;
                         this.refresh();
@@ -123433,7 +123435,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('MediaSelectorComponent', MediaSelectorComponent = __decorate$f([
                 Component({
                     selector: `sa-${moduleName$5}`,
-                    templateUrl: `${localDir$9}/${moduleName$5}/${moduleName$5}.component${min$8}.html`,
+                    templateUrl: `${localDir$a}/${moduleName$5}/${moduleName$5}.component${min$9}.html`,
                 }),
                 __metadata$d("design:paramtypes", [MatIconRegistry,
                     DomSanitizer,
@@ -123463,8 +123465,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             };
             const systemDir$4 = '@stratusjs/angular';
             const moduleName$4 = 'selector';
-            const min$7 = !cookie('env') ? '.min' : '';
-            const localDir$8 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$4}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$8 = !cookie('env') ? '.min' : '';
+            const localDir$9 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$4}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             const has = (object, path) => _.has(object, path) && !_.isEmpty(_.get(object, path));
             let SelectorComponent = exports('SelectorComponent', class SelectorComponent extends RootComponent {
                 constructor(iconRegistry, sanitizer, ref, elementRef) {
@@ -123492,7 +123494,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         selector_status: `${Stratus.BaseUrl}sitetheorycore/images/icons/actionButtons/visibility.svg`,
                         selector_edit: `${Stratus.BaseUrl}sitetheorycore/images/icons/actionButtons/edit.svg`
                     }, (value, key) => iconRegistry.addSvgIcon(key, sanitizer.bypassSecurityTrustResourceUrl(value)).getNamedSvgIcon(key));
-                    Stratus.Internals.CssLoader(`${localDir$8}${moduleName$4}/${moduleName$4}.component${min$7}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$9}${moduleName$4}/${moduleName$4}.component${min$8}.css`)
                         .then(() => {
                         this.styled = true;
                         this.refresh();
@@ -123718,7 +123720,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('SelectorComponent', SelectorComponent = __decorate$e([
                 Component({
                     selector: `sa-${moduleName$4}`,
-                    templateUrl: `${localDir$8}/${moduleName$4}/${moduleName$4}.component${min$7}.html`,
+                    templateUrl: `${localDir$9}/${moduleName$4}/${moduleName$4}.component${min$8}.html`,
                 }),
                 __metadata$c("design:paramtypes", [MatIconRegistry,
                     DomSanitizer,
@@ -123749,8 +123751,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             };
             const systemDir$3 = '@stratusjs/angular';
             const moduleName$3 = 'tree';
-            const min$6 = !cookie('env') ? '.min' : '';
-            const localDir$7 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$3}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$7 = !cookie('env') ? '.min' : '';
+            const localDir$8 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$3}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let TreeComponent = exports('TreeComponent', class TreeComponent extends RootComponent {
                 constructor(iconRegistry, sanitizer, backend, ref, elementRef, document) {
                     super();
@@ -123786,7 +123788,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$3)}_component_`);
                     Stratus.Instances[this.uid] = this;
                     this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "isInitialized", "isDestroyed", "isStyled", "target", "targetSuffix", "id", "manifest", "decouple", "direct", "api", "urlRoot", "type", "property", "_", "Stratus", "registry", "fetched", "data", "collection", "model", "dataSub", "onChange", "subscriber", "unsettled", "svgIcons", "isSingleClick", "dblClickWait", "dropLists", "dropListIdMap", "dropListMap", "expandedNodeSet", "dragging", "expandTimeout", "expandDelay", "dropData", "cdkDropListSortingDisabled", "dropDebug", "tree", "treeMap", "metaMap", "dataSource", "treeControl", "iconRegistry", "sanitizer", "backend", "ref", "elementRef", "document", "ngOnInit", "ngOnDestroy", "refresh", "remove", "removeNode", "nodeIsEqual", "fetchData", "dataDefer", "dataRef", "trackDropLists", "setExpanded", "setExpandedClick", "setExpandedDblClick", "onDragDrop", "onDragMove", "showDragData", "clearDragData", "buildNodePatch", "getSvg", "addSvgIcon", "hydrate", "disableRefresh", "stagger", "reloading"]);
-                    Stratus.Internals.CssLoader(`${localDir$7}/${moduleName$3}/${moduleName$3}.component${min$6}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$8}/${moduleName$3}/${moduleName$3}.component${min$7}.css`)
                         .then(() => {
                         this.isStyled = true;
                         this.refresh();
@@ -124250,7 +124252,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('TreeComponent', TreeComponent = __decorate$d([
                 Component({
                     selector: `sa-${moduleName$3}`,
-                    templateUrl: `${localDir$7}/${moduleName$3}/${moduleName$3}.component${min$6}.html`,
+                    templateUrl: `${localDir$8}/${moduleName$3}/${moduleName$3}.component${min$7}.html`,
                 }),
                 __param$2(5, Inject(DOCUMENT)),
                 __metadata$b("design:paramtypes", [MatIconRegistry,
@@ -124276,8 +124278,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemDir$2 = '@stratusjs/angular';
             const moduleName$2 = 'tree-dialog';
             const parentModuleName$1 = 'tree';
-            const min$5 = !cookie('env') ? '.min' : '';
-            const localDir$6 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$2}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$6 = !cookie('env') ? '.min' : '';
+            const localDir$7 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$2}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let TreeDialogComponent = exports('TreeDialogComponent', class TreeDialogComponent extends ResponsiveComponent {
                 constructor(dialogRef, data, fb, ref) {
                     super();
@@ -124301,7 +124303,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 ngOnInit() {
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$2)}_component_`);
                     Stratus.Instances[this.uid] = this;
-                    Stratus.Internals.CssLoader(`${localDir$6}/${parentModuleName$1}/${moduleName$2}.component${min$5}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$7}/${parentModuleName$1}/${moduleName$2}.component${min$6}.css`)
                         .then(() => {
                         this.isStyled = true;
                     })
@@ -124427,7 +124429,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     return this.tree.getSvg(url, options);
                 }
                 getQueryUrl(query, id) {
-                    query = (!_.isString(query) || _.isEmpty(query)) ? '' : `"${query}"`;
+                    query = (!_.isString(query) || _.isEmpty(query)) ? '' : query;
                     id = !_.isString(id) && !_.isNumber(id) ? '' : `/${id}`;
                     return `${this.apiBase}${id}?limit=${this.limit}&${this.basicContentQueryAttributes}&q=${query}`;
                 }
@@ -124451,7 +124453,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('TreeDialogComponent', TreeDialogComponent = __decorate$c([
                 Component({
                     selector: `sa-${moduleName$2}`,
-                    templateUrl: `${localDir$6}/${parentModuleName$1}/${moduleName$2}.component${min$5}.html`,
+                    templateUrl: `${localDir$7}/${parentModuleName$1}/${moduleName$2}.component${min$6}.html`,
                 }),
                 __param$1(1, Inject(MAT_DIALOG_DATA)),
                 __metadata$a("design:paramtypes", [MatDialogRef, Object, FormBuilder,
@@ -124470,8 +124472,8 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const systemDir$1 = '@stratusjs/angular';
             const moduleName$1 = 'tree-node';
             const parentModuleName = 'tree';
-            const min$4 = !cookie('env') ? '.min' : '';
-            const localDir$5 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$1}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
+            const min$5 = !cookie('env') ? '.min' : '';
+            const localDir$6 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir$1}/*`].replace(/[^/]*$/, '').replace(/\/dist\/$/, '/src/')}`;
             let TreeNodeComponent = exports('TreeNodeComponent', class TreeNodeComponent extends ResponsiveComponent {
                 constructor(dialog, ref) {
                     super();
@@ -124489,7 +124491,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 ngOnInit() {
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$1)}_component_`);
                     Stratus.Instances[this.uid] = this;
-                    Stratus.Internals.CssLoader(`${localDir$5}/${parentModuleName}/${moduleName$1}.component${min$4}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$6}/${parentModuleName}/${moduleName$1}.component${min$5}.css`)
                         .then(() => {
                         this.isStyled = true;
                         this.refresh();
@@ -124700,7 +124702,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             exports('TreeNodeComponent', TreeNodeComponent = __decorate$b([
                 Component({
                     selector: `sa-${moduleName$1}`,
-                    templateUrl: `${localDir$5}/${parentModuleName}/${moduleName$1}.component${min$4}.html`,
+                    templateUrl: `${localDir$6}/${parentModuleName}/${moduleName$1}.component${min$5}.html`,
                 }),
                 __metadata$9("design:paramtypes", [MatDialog,
                     ChangeDetectorRef])
@@ -127455,7 +127457,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             };
             const packageName$6 = 'map';
             const systemDir = `@stratusjs/${packageName$6}`;
-            const localDir$4 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir}/*`].replace(/[^/]*$/, '').replace(/angular\/dist\/$/, 'map/src/')}`;
+            const localDir$5 = `${Stratus.BaseUrl}${boot.configuration.paths[`${systemDir}/*`].replace(/[^/]*$/, '').replace(/angular\/dist\/$/, 'map/src/')}`;
             const moduleName = 'map';
             const devGoogleMapsKey = 'AIzaSyBAyMH-A99yD5fHQPz7uzqk8glNJYGEqus';
             class Watcher {
@@ -127553,7 +127555,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.highestMarkerZIndex = 0;
                     this.uid = safeUniqueId('sa', moduleName, 'component');
                     Stratus.Instances[this.uid] = this;
-                    Stratus.Internals.CssLoader(`${localDir$4}/${moduleName}.component.css`)
+                    Stratus.Internals.CssLoader(`${localDir$5}/${moduleName}.component.css`)
                         .then(() => {
                         this.styled = true;
                     })
@@ -128014,7 +128016,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             MapComponent = __decorate$a([
                 Component({
                     selector: `sa-${moduleName}`,
-                    templateUrl: `${localDir$4}/${moduleName}.component.html`
+                    templateUrl: `${localDir$5}/${moduleName}.component.html`
                 }),
                 __metadata$8("design:paramtypes", [KeyValueDiffers,
                     Window,
@@ -128077,11 +128079,25 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     step((generator = generator.apply(thisArg, _arguments || [])).next());
                 });
             };
+            class StripeComponent extends RootComponent$1 {
+                constructor() {
+                    super(...arguments);
+                    this.styled = false;
+                    this.initialized = false;
+                }
+            }
+            __decorate$8([
+                Input(),
+                __metadata$7("design:type", String)
+            ], StripeComponent.prototype, "elementId", void 0);
+            class StripeListComponent extends StripeComponent {
+            }
             let StripeService = class StripeService {
                 constructor() {
                     this.publishKey = '';
                     this.Stripe = {};
-                    this.collections = [];
+                    this.instanceOnEmitters = {};
+                    this.collections = {};
                     this.initializing = false;
                     this.initialized = false;
                     Stratus.Services.Stripe = this;
@@ -128195,12 +128211,29 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         return this.Stripe.stripe.confirmCardSetup(clientSecret, stripeData, options);
                     });
                 }
-                registerCollection(collection) {
-                    this.collections.push(collection);
+                registerCollection(component, collection) {
+                    this.collections[component.uid] = { uid: component.uid, component, collection };
                 }
-                fetchCollections() {
-                    this.collections.forEach((collection) => {
-                        collection.fetch().then();
+                fetchCollections(uid) {
+                    return __awaiter$6(this, void 0, void 0, function* () {
+                        let uids;
+                        if (isString(uid) &&
+                            uid.length > 0) {
+                            uids = [uid];
+                        }
+                        else {
+                            uids = Object.keys(this.collections);
+                        }
+                        const uidList = [];
+                        uids.forEach((uidName) => {
+                            if (Object.prototype.hasOwnProperty.call(this.collections, uidName)) {
+                                uidList.push(() => __awaiter$6(this, void 0, void 0, function* () {
+                                    yield this.collections[uidName].collection.fetch();
+                                    this.emitManual('collectionUpdated', uidName, this.collections[uidName].component, this.collections[uidName].collection);
+                                }));
+                            }
+                        });
+                        yield Promise.all(uidList.map(fn => fn()));
                     });
                 }
                 createElement(id, publishKey, paymentMethodType, options, mountElement) {
@@ -128264,6 +128297,53 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         this.currentElement = undefined;
                     }
                 }
+                emit(emitterName, component, ...variables) {
+                    this.emitManual(emitterName, component.elementId, component, variables);
+                }
+                emitManual(emitterName, uid, component, ...variables) {
+                    var _a, _b;
+                    var _c, _d;
+                    if (Object.prototype.hasOwnProperty.call(this.instanceOnEmitters, uid) &&
+                        Object.prototype.hasOwnProperty.call(this.instanceOnEmitters[uid], emitterName)) {
+                        Object.values(this.instanceOnEmitters[uid][emitterName]).forEach((emitter) => {
+                            try {
+                                emitter(component, variables);
+                            }
+                            catch (e) {
+                                console.error(e, 'issue sending back emitter on', uid, emitterName, emitter);
+                            }
+                        });
+                    }
+                    if (emitterName === 'init') {
+                        (_a = (_c = this.instanceOnEmitters)[uid]) !== null && _a !== void 0 ? _a : (_c[uid] = {});
+                        (_b = (_d = this.instanceOnEmitters[uid])[emitterName]) !== null && _b !== void 0 ? _b : (_d[emitterName] = {});
+                    }
+                }
+                removeOnManual(emitterName, emitterId, onId) {
+                    if (Object.prototype.hasOwnProperty.call(this.instanceOnEmitters, emitterId) &&
+                        Object.prototype.hasOwnProperty.call(this.instanceOnEmitters[emitterId], emitterName) &&
+                        Object.prototype.hasOwnProperty.call(this.instanceOnEmitters[emitterId][emitterName], onId)) {
+                        delete this.instanceOnEmitters[emitterId][emitterName][onId];
+                    }
+                }
+                on(uid, emitterName, callback) {
+                    if (emitterName === 'init' &&
+                        Object.prototype.hasOwnProperty.call(this.instanceOnEmitters, uid) &&
+                        Object.prototype.hasOwnProperty.call(this.instanceOnEmitters[uid], emitterName) &&
+                        Object.prototype.hasOwnProperty.call(Stratus.Instances, uid)) {
+                        callback(Stratus.Instances[uid]);
+                        return;
+                    }
+                    if (!Object.prototype.hasOwnProperty.call(this.instanceOnEmitters, uid)) {
+                        this.instanceOnEmitters[uid] = {};
+                    }
+                    if (!Object.prototype.hasOwnProperty.call(this.instanceOnEmitters[uid], emitterName)) {
+                        this.instanceOnEmitters[uid][emitterName] = {};
+                    }
+                    const onId = uniqueId$3();
+                    this.instanceOnEmitters[uid][emitterName][onId] = callback;
+                    return () => { this.removeOnManual(uid, emitterName, onId); };
+                }
             };
             StripeService = __decorate$8([
                 Injectable({
@@ -128293,11 +128373,11 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     step((generator = generator.apply(thisArg, _arguments || [])).next());
                 });
             };
-            const min$3 = !cookie('env') ? '.min' : '';
+            const min$4 = !cookie('env') ? '.min' : '';
             const packageName$5 = 'stripe';
             const componentName$5 = 'payment-method';
-            const localDir$3 = `${Stratus.BaseUrl}${Stratus.DeploymentPath}@stratusjs/${packageName$5}/src/`;
-            let StripePaymentMethodComponent = class StripePaymentMethodComponent extends RootComponent {
+            const localDir$4 = `${Stratus.BaseUrl}${Stratus.DeploymentPath}@stratusjs/${packageName$5}/src/`;
+            let StripePaymentMethodComponent = class StripePaymentMethodComponent extends StripeComponent {
                 constructor(elementRef, sanitizer, Stripe, dialogRef, dialogData) {
                     super();
                     this.elementRef = elementRef;
@@ -128308,8 +128388,6 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.title = `${packageName$5}_${componentName$5}_component`;
                     this.urlRoot = '/Api';
                     this.paymentMethodApiPath = 'PaymentMethod';
-                    this.styled = false;
-                    this.initialized = false;
                     this.cardComplete = false;
                     this.cardSaved = false;
                     this.formPending = false;
@@ -128321,7 +128399,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.uid = safeUniqueId('sa', snakeCase(this.title));
                     Stratus.Instances[this.uid] = this;
                     this.elementId = this.elementId || this.uid;
-                    Stratus.Internals.CssLoader(`${localDir$3}${componentName$5}.component${min$3}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$4}${componentName$5}.component${min$4}.css`)
                         .then(() => {
                         this.styled = true;
                     })
@@ -128329,7 +128407,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         console.error('CSS Failed to load for Component:', this);
                         this.styled = false;
                     });
-                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "elementId", "_", "urlRoot", "paymentMethodApiPath", "styled", "initialized", "cardComplete", "cardSaved", "formPending", "clientSecret", "publishKey", "formMessage", "detailedBillingInfo", "defaultBillingInfo", "billingInfo", "cardId", "elementRef", "sanitizer", "Stripe", "dialogRef", "dialogData", "ngOnInit", "isEditable", "isBillingDetailsFilled", "isSubmittable", "saveCard", "dialogClose", "ngOnDestroy", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh"]);
+                    this.hydrate(this.elementRef, this.sanitizer, ["title", "_", "urlRoot", "paymentMethodApiPath", "cardComplete", "cardSaved", "formPending", "clientSecret", "publishKey", "formMessage", "detailedBillingInfo", "defaultBillingInfo", "billingInfo", "cardId", "elementRef", "sanitizer", "Stripe", "dialogRef", "dialogData", "ngOnInit", "isEditable", "isBillingDetailsFilled", "isSubmittable", "saveCard", "dialogClose", "ngOnDestroy", "uid", "elementId", "styled", "initialized", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh"]);
                     if (!isEmpty(this.dialogData)) {
                         const keysPossible = ["clientSecret", "publishKey", "formMessage", "urlRoot", "paymentMethodApiPath", "detailedBillingInfo", "defaultBillingInfo"];
                         Object.keys(this.dialogData).forEach((attr) => {
@@ -128419,7 +128497,13 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                             yield model.save();
                             this.cardSaved = true;
                             this.formPending = false;
-                            this.Stripe.fetchCollections();
+                            yield this.Stripe.fetchCollections();
+                            const cardDetails = {
+                                type: 'card',
+                                name: this.billingInfo.name,
+                                email: this.billingInfo.email
+                            };
+                            this.Stripe.emitManual('paymentMethodCreated', 'Stripe', this, cardDetails);
                         }
                         else {
                             this.formPending = false;
@@ -128441,10 +128525,6 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     super.ngOnDestroy();
                 }
             };
-            __decorate$7([
-                Input(),
-                __metadata$6("design:type", String)
-            ], StripePaymentMethodComponent.prototype, "elementId", void 0);
             __decorate$7([
                 Input(),
                 __metadata$6("design:type", String)
@@ -128476,7 +128556,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             StripePaymentMethodComponent = __decorate$7([
                 Component({
                     selector: `sa-${packageName$5}-${componentName$5}`,
-                    templateUrl: `${localDir$3}${componentName$5}.component${min$3}.html`,
+                    templateUrl: `${localDir$4}${componentName$5}.component${min$4}.html`,
                 }),
                 __param(3, Optional()),
                 __param(4, Optional()),
@@ -128505,24 +128585,24 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     step((generator = generator.apply(thisArg, _arguments || [])).next());
                 });
             };
-            const min$2 = !cookie('env') ? '.min' : '';
+            const min$3 = !cookie('env') ? '.min' : '';
             const packageName$4 = 'stripe';
             const componentName$4 = 'payment-method-item';
-            const localDir$2 = `${Stratus.BaseUrl}${Stratus.DeploymentPath}@stratusjs/${packageName$4}/src/`;
-            let StripePaymentMethodItemComponent = class StripePaymentMethodItemComponent extends RootComponent {
-                constructor(dialog, elementRef, sanitizer) {
+            const localDir$3 = `${Stratus.BaseUrl}${Stratus.DeploymentPath}@stratusjs/${packageName$4}/src/`;
+            let StripePaymentMethodItemComponent = class StripePaymentMethodItemComponent extends StripeComponent {
+                constructor(dialog, elementRef, sanitizer, Stripe) {
                     super();
                     this.dialog = dialog;
                     this.elementRef = elementRef;
                     this.sanitizer = sanitizer;
+                    this.Stripe = Stripe;
                     this.title = `${packageName$4}_${componentName$4}_component`;
                     this.editable = false;
-                    this.styled = false;
-                    this.initialized = false;
+                    this.urlRoot = '/Api';
                     this.uid = safeUniqueId('sa', snakeCase(this.title));
                     Stratus.Instances[this.uid] = this;
                     this.elementId = this.elementId || this.uid;
-                    Stratus.Internals.CssLoader(`${localDir$2}${componentName$4}.component${min$2}.css`)
+                    Stratus.Internals.CssLoader(`${localDir$3}${componentName$4}.component${min$3}.css`)
                         .then(() => {
                         this.styled = true;
                     })
@@ -128530,15 +128610,18 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         console.error('CSS Failed to load for Component:', this);
                         this.styled = false;
                     });
-                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "elementId", "model", "editable", "styled", "initialized", "dialog", "elementRef", "sanitizer", "ngOnInit", "getCardLogoUrl", "isExpired", "isExpiring", "deletePM", "deletePMConfirmation", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
+                    this.hydrate(this.elementRef, this.sanitizer, ["title", "model", "editable", "urlRoot", "dialog", "elementRef", "sanitizer", "Stripe", "ngOnInit", "getCardLogoUrl", "isExpired", "isExpiring", "deletePM", "deletePMConfirmation", "uid", "elementId", "styled", "initialized", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
                 }
                 ngOnInit() {
                     return __awaiter$4(this, void 0, void 0, function* () {
                         this.initialized = true;
+                        if (this.urlRoot) {
+                            this.model.urlRoot = `${this.urlRoot}${this.model.target ? '/' + this.model.target : ''}`;
+                        }
                     });
                 }
                 getCardLogoUrl(brand) {
-                    return `${localDir$2}/images/card/${brand}.png`;
+                    return `${localDir$3}/images/card/${brand}.png`;
                 }
                 isExpired() {
                     if (this.model.pending) {
@@ -128592,22 +128675,12 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         if (!dialogResult) {
                             return;
                         }
-                        let collection;
-                        if (this.model.collection) {
-                            collection = this.model.collection;
-                        }
                         yield this.model.destroy();
-                        if (collection) {
-                            collection.fetch();
-                        }
+                        this.Stripe.fetchCollections();
                     }));
                     return dialog;
                 }
             };
-            __decorate$6([
-                Input(),
-                __metadata$5("design:type", String)
-            ], StripePaymentMethodItemComponent.prototype, "elementId", void 0);
             __decorate$6([
                 Input(),
                 __metadata$5("design:type", Model)
@@ -128616,14 +128689,19 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 Input(),
                 __metadata$5("design:type", Object)
             ], StripePaymentMethodItemComponent.prototype, "editable", void 0);
+            __decorate$6([
+                Input(),
+                __metadata$5("design:type", Object)
+            ], StripePaymentMethodItemComponent.prototype, "urlRoot", void 0);
             StripePaymentMethodItemComponent = __decorate$6([
                 Component({
                     selector: `sa-${packageName$4}-${componentName$4}`,
-                    templateUrl: `${localDir$2}${componentName$4}.component${min$2}.html`,
+                    templateUrl: `${localDir$3}${componentName$4}.component${min$3}.html`,
                 }),
                 __metadata$5("design:paramtypes", [MatDialog,
                     ElementRef,
-                    DomSanitizer])
+                    DomSanitizer,
+                    StripeService])
             ], StripePaymentMethodItemComponent);
 
             var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -128644,19 +128722,28 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     step((generator = generator.apply(thisArg, _arguments || [])).next());
                 });
             };
+            const min$2 = !cookie('env') ? '.min' : '';
             const packageName$3 = 'stripe';
             const componentName$3 = 'payment-method-item-display';
-            let StripePaymentMethodItemDisplayComponent = class StripePaymentMethodItemDisplayComponent extends RootComponent {
+            const localDir$2 = `${Stratus.BaseUrl}${Stratus.DeploymentPath}@stratusjs/${packageName$3}/src/`;
+            let StripePaymentMethodItemDisplayComponent = class StripePaymentMethodItemDisplayComponent extends StripeComponent {
                 constructor(elementRef, sanitizer) {
                     super();
                     this.elementRef = elementRef;
                     this.sanitizer = sanitizer;
                     this.title = `${packageName$3}_${componentName$3}_component`;
-                    this.initialized = false;
                     this.uid = safeUniqueId('sa', snakeCase(this.title));
                     Stratus.Instances[this.uid] = this;
                     this.elementId = this.elementId || this.uid;
-                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "initialized", "elementId", "model", "name", "brand", "last4", "expMonth", "expYear", "elementRef", "sanitizer", "ngOnInit", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
+                    Stratus.Internals.CssLoader(`${localDir$2}${componentName$3}.component${min$2}.css`)
+                        .then(() => {
+                        this.styled = true;
+                    })
+                        .catch(() => {
+                        console.error('CSS Failed to load for Component:', this);
+                        this.styled = false;
+                    });
+                    this.hydrate(this.elementRef, this.sanitizer, ["title", "model", "name", "brand", "last4", "expMonth", "expYear", "elementRef", "sanitizer", "ngOnInit", "uid", "elementId", "styled", "initialized", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
                 }
                 ngOnInit() {
                     return __awaiter$3(this, void 0, void 0, function* () {
@@ -128697,10 +128784,6 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     });
                 }
             };
-            __decorate$5([
-                Input(),
-                __metadata$4("design:type", String)
-            ], StripePaymentMethodItemDisplayComponent.prototype, "elementId", void 0);
             __decorate$5([
                 Input(),
                 __metadata$4("design:type", String)
@@ -128752,7 +128835,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const packageName$2 = 'stripe';
             const componentName$2 = 'payment-method-list';
             const localDir$1 = `${Stratus.BaseUrl}${Stratus.DeploymentPath}@stratusjs/${packageName$2}/src/`;
-            let StripePaymentMethodListComponent = class StripePaymentMethodListComponent extends RootComponent {
+            let StripePaymentMethodListComponent = class StripePaymentMethodListComponent extends StripeListComponent {
                 constructor(elementRef, ref, sanitizer, Stripe) {
                     super();
                     this.elementRef = elementRef;
@@ -128760,8 +128843,6 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.sanitizer = sanitizer;
                     this.Stripe = Stripe;
                     this.title = `${packageName$2}_${componentName$2}_component`;
-                    this.styled = false;
-                    this.initialized = false;
                     this.urlRoot = '/Api';
                     this.paymentMethodApiPath = 'PaymentMethod';
                     this.addCardButtonText = 'Add Payment Method';
@@ -128778,7 +128859,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         console.error('CSS Failed to load for Component:', this);
                         this.styled = false;
                     });
-                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "elementId", "styled", "initialized", "urlRoot", "paymentMethodApiPath", "addCardButtonText", "disabled", "property", "detailedBillingInfo", "defaultBillingName", "defaultBillingEmail", "defaultBillingPhone", "defaultBillingZip", "defaultBillingState", "defaultBillingCity", "defaultBillingAddress1", "defaultBillingAddress2", "defaultBillingInfo", "paymentCollection", "elementRef", "ref", "sanitizer", "Stripe", "ngOnInit", "fetchPaymentMethods", "hydrate", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
+                    this.hydrate(this.elementRef, this.sanitizer, ["title", "urlRoot", "paymentMethodApiPath", "addCardButtonText", "disabled", "property", "detailedBillingInfo", "defaultBillingName", "defaultBillingEmail", "defaultBillingPhone", "defaultBillingZip", "defaultBillingState", "defaultBillingCity", "defaultBillingAddress1", "defaultBillingAddress2", "defaultBillingInfo", "elementRef", "ref", "sanitizer", "Stripe", "ngOnInit", "collection", "uid", "elementId", "styled", "initialized", "hydrate", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
                     const apiOptions = {
                         autoSave: false,
                         target: this.paymentMethodApiPath,
@@ -128787,7 +128868,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     if (this.urlRoot) {
                         apiOptions.urlRoot = this.urlRoot;
                     }
-                    this.paymentCollection = new Collection(apiOptions);
+                    this.collection = new Collection(apiOptions);
                     if (this.defaultBillingName) {
                         this.defaultBillingInfo.name = this.defaultBillingName;
                     }
@@ -128815,22 +128896,16 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 }
                 ngOnInit() {
                     return __awaiter$2(this, void 0, void 0, function* () {
-                        yield this.fetchPaymentMethods();
-                        this.Stripe.registerCollection(this.paymentCollection);
+                        this.Stripe.registerCollection(this, this.collection);
+                        this.Stripe.fetchCollections(this.uid).then();
                         this.initialized = true;
-                    });
-                }
-                fetchPaymentMethods() {
-                    return __awaiter$2(this, void 0, void 0, function* () {
-                        yield this.paymentCollection.fetch();
-                        yield this.refresh();
+                        this.Stripe.emit('init', this);
+                        this.Stripe.on(this.uid, 'collectionUpdated', (_source, _collection) => {
+                            this.refresh();
+                        });
                     });
                 }
             };
-            __decorate$4([
-                Input(),
-                __metadata$3("design:type", String)
-            ], StripePaymentMethodListComponent.prototype, "elementId", void 0);
             __decorate$4([
                 Input(),
                 __metadata$3("design:type", String)
@@ -128920,7 +128995,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             const packageName$1 = 'stripe';
             const componentName$1 = 'payment-method-selector';
             const localDir = `${Stratus.BaseUrl}${Stratus.DeploymentPath}@stratusjs/${packageName$1}/src/`;
-            let StripePaymentMethodSelectorComponent = class StripePaymentMethodSelectorComponent extends RootComponent {
+            let StripePaymentMethodSelectorComponent = class StripePaymentMethodSelectorComponent extends StripeListComponent {
                 constructor(elementRef, fb, ref, sanitizer, Stripe) {
                     super();
                     this.elementRef = elementRef;
@@ -128929,11 +129004,10 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.sanitizer = sanitizer;
                     this.Stripe = Stripe;
                     this.title = `${packageName$1}_${componentName$1}_component`;
-                    this.styled = false;
-                    this.initialized = false;
                     this.urlRoot = '/Api';
                     this.paymentMethodApiPath = 'PaymentMethod';
                     this.addCardButtonText = 'Add Payment Method';
+                    this.selectCardButtonText = 'Select Default Payment Method';
                     this.disabled = false;
                     this.defaultBillingInfo = { address: {} };
                     this.fieldName = 'paymentSelection';
@@ -128956,7 +129030,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                         this.styled = false;
                         this.refresh().then();
                     });
-                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "elementId", "styled", "initialized", "target", "targetSuffix", "id", "manifest", "decouple", "direct", "api", "urlRoot", "registryModel", "paymentMethodApiPath", "addCardButtonText", "disabled", "property", "detailedBillingInfo", "defaultBillingName", "defaultBillingEmail", "defaultBillingPhone", "defaultBillingZip", "defaultBillingState", "defaultBillingCity", "defaultBillingAddress1", "defaultBillingAddress2", "defaultBillingInfo", "fieldName", "fieldNameId", "registry", "fetched", "model", "dataSub", "subscriber", "form", "paymentCollection", "elementRef", "fb", "ref", "sanitizer", "Stripe", "ngOnInit", "fetchPaymentMethods", "valueChanged", "normalizeOut", "normalizeIn", "fetchData", "objectComparisonFunction", "dataDefer", "dataRef", "handleObservableError", "isPMExpired", "hydrate", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
+                    this.hydrate(this.elementRef, this.sanitizer, ["title", "target", "targetSuffix", "id", "manifest", "decouple", "direct", "api", "urlRoot", "registryModel", "paymentMethodApiPath", "addCardButtonText", "selectCardButtonText", "disabled", "property", "detailedBillingInfo", "defaultBillingName", "defaultBillingEmail", "defaultBillingPhone", "defaultBillingZip", "defaultBillingState", "defaultBillingCity", "defaultBillingAddress1", "defaultBillingAddress2", "defaultBillingInfo", "fieldName", "fieldNameId", "registry", "fetched", "model", "dataSub", "subscriber", "form", "paymentSelect", "elementRef", "fb", "ref", "sanitizer", "Stripe", "ngOnInit", "valueChanged", "normalizeOut", "normalizeIn", "fetchData", "objectComparisonFunction", "dataDefer", "dataRef", "handleObservableError", "isPMExpired", "selectorListClose", "selectorListOpen", "collection", "uid", "elementId", "styled", "initialized", "hydrate", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
                     const apiOptions = {
                         autoSave: false,
                         target: this.paymentMethodApiPath,
@@ -128965,7 +129039,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     if (this.urlRoot) {
                         apiOptions.urlRoot = this.urlRoot;
                     }
-                    this.paymentCollection = new Collection(apiOptions);
+                    this.collection = new Collection(apiOptions);
                     if (this.defaultBillingName) {
                         this.defaultBillingInfo.name = this.defaultBillingName;
                     }
@@ -129031,16 +129105,28 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                                 return;
                             }
                             this.valueChanged(value);
-                        });
-                        yield this.fetchPaymentMethods();
-                        this.Stripe.registerCollection(this.paymentCollection);
+                        }).then();
+                        this.Stripe.registerCollection(this, this.collection);
+                        this.Stripe.fetchCollections(this.uid).then();
                         this.initialized = true;
-                    });
-                }
-                fetchPaymentMethods() {
-                    return __awaiter$1(this, void 0, void 0, function* () {
-                        yield this.paymentCollection.fetch();
-                        yield this.refresh();
+                        this.Stripe.emit('init', this);
+                        this.Stripe.on(this.uid, 'collectionUpdated', (_source, _collection) => {
+                            this.refresh();
+                            this.selectorListClose();
+                        });
+                        this.Stripe.on('Stripe', 'paymentMethodCreated', (_source, details) => {
+                            const newCardDetails = details[0];
+                            if (!isEmpty(newCardDetails.type) &&
+                                !isEmpty(newCardDetails.name) &&
+                                !isEmpty(newCardDetails.email)) {
+                                const newPM = this.collection.models.slice(-1)[0];
+                                if (newPM.get('type') === newCardDetails.type &&
+                                    newPM.get('name') === newCardDetails.name &&
+                                    newPM.get('email') === newCardDetails.email) {
+                                    this.valueChanged(newPM);
+                                }
+                            }
+                        });
                     });
                 }
                 valueChanged(value) {
@@ -129116,11 +129202,23 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     }
                     return paymentMethod.data.exp_month < month;
                 }
+                selectorListClose(ev) {
+                    if (ev) {
+                        ev.preventDefault();
+                    }
+                    if (this.paymentSelect && this.paymentSelect.panelOpen) {
+                        this.paymentSelect.close();
+                    }
+                }
+                selectorListOpen(ev) {
+                    if (ev) {
+                        ev.preventDefault();
+                    }
+                    if (this.paymentSelect && !this.paymentSelect.panelOpen) {
+                        this.paymentSelect.open();
+                    }
+                }
             };
-            __decorate$3([
-                Input(),
-                __metadata$2("design:type", String)
-            ], StripePaymentMethodSelectorComponent.prototype, "elementId", void 0);
             __decorate$3([
                 Input(),
                 __metadata$2("design:type", String)
@@ -129165,6 +129263,10 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 Input(),
                 __metadata$2("design:type", String)
             ], StripePaymentMethodSelectorComponent.prototype, "addCardButtonText", void 0);
+            __decorate$3([
+                Input(),
+                __metadata$2("design:type", String)
+            ], StripePaymentMethodSelectorComponent.prototype, "selectCardButtonText", void 0);
             __decorate$3([
                 Input(),
                 __metadata$2("design:type", Object)
@@ -129209,6 +129311,10 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 Input(),
                 __metadata$2("design:type", String)
             ], StripePaymentMethodSelectorComponent.prototype, "defaultBillingAddress2", void 0);
+            __decorate$3([
+                ViewChild('paymentSelect', { static: false }),
+                __metadata$2("design:type", MatSelect)
+            ], StripePaymentMethodSelectorComponent.prototype, "paymentSelect", void 0);
             StripePaymentMethodSelectorComponent = __decorate$3([
                 Component({
                     selector: `sa-${packageName$1}-${componentName$1}`,
@@ -129242,7 +129348,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             };
             const packageName = 'stripe';
             const componentName = 'setup-intent';
-            let StripeSetupIntentComponent = class StripeSetupIntentComponent extends RootComponent {
+            let StripeSetupIntentComponent = class StripeSetupIntentComponent extends StripeComponent {
                 constructor(elementRef, sanitizer, dialog) {
                     super();
                     this.elementRef = elementRef;
@@ -129259,7 +129365,7 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.uid = safeUniqueId('sa', snakeCase(this.title));
                     Stratus.Instances[this.uid] = this;
                     this.elementId = this.elementId || this.uid;
-                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "elementId", "styled", "initialized", "newPaymentMethodPrompt", "newPaymentMethodPending", "urlRoot", "paymentMethodApiPath", "addCardButtonText", "detailedBillingInfo", "defaultBillingInfo", "elementRef", "sanitizer", "dialog", "ngOnInit", "addPaymentMethod", "inputPaymentMethod", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
+                    this.hydrate(this.elementRef, this.sanitizer, ["title", "styled", "initialized", "newPaymentMethodPrompt", "newPaymentMethodPending", "urlRoot", "paymentMethodApiPath", "addCardButtonText", "detailedBillingInfo", "defaultBillingInfo", "elementRef", "sanitizer", "dialog", "ngOnInit", "addPaymentMethod", "inputPaymentMethod", "uid", "elementId", "hydrate", "ref", "disableRefresh", "stagger", "reloading", "refresh", "ngOnDestroy"]);
                 }
                 ngOnInit() {
                     this.initialized = true;
@@ -129332,10 +129438,6 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     });
                 }
             };
-            __decorate$2([
-                Input(),
-                __metadata$1("design:type", String)
-            ], StripeSetupIntentComponent.prototype, "elementId", void 0);
             __decorate$2([
                 Input(),
                 __metadata$1("design:type", String)
@@ -160996,6 +161098,165 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
             })
                 .catch(err => console.error('@stratusjs/angular failed to initialize!', err));
 
+            System.register(["quill"], function (exports_1, context_1) {
+                var quill_1, debug, Logger, QuillHtmlEditPlugin;
+                context_1 && context_1.id;
+                function $create(elName) {
+                    return document.createElement(elName);
+                }
+                function $setAttr(el, key, value) {
+                    return el.setAttribute(key, value);
+                }
+                function launchPopupEditor(quill, options) {
+                    const htmlFromEditor = quill.container.querySelector('.ql-editor').innerHTML;
+                    const popupContainer = $create('div');
+                    const overlayContainer = $create('div');
+                    const msg = options.msg || 'Edit HTML here, when you click "OK" the quill editor\'s contents will be replaced';
+                    const cancelText = options.cancelText || 'Cancel';
+                    const okText = options.okText || 'Ok';
+                    $setAttr(overlayContainer, 'class', 'ql-html-overlayContainer');
+                    $setAttr(popupContainer, 'class', 'ql-html-popupContainer');
+                    const popupTitle = $create('i');
+                    $setAttr(popupTitle, 'class', 'ql-html-popupTitle');
+                    popupTitle.innerText = msg;
+                    const textContainer = $create('div');
+                    textContainer.appendChild(popupTitle);
+                    $setAttr(textContainer, 'class', 'ql-html-textContainer');
+                    const textArea = $create('textarea');
+                    $setAttr(textArea, 'class', 'ql-html-textArea');
+                    textArea.value = formatHTML(htmlFromEditor);
+                    const buttonCancel = $create('button');
+                    buttonCancel.innerHTML = cancelText;
+                    $setAttr(buttonCancel, 'class', 'ql-html-buttonCancel');
+                    const buttonOk = $create('button');
+                    buttonOk.innerHTML = okText;
+                    const buttonGroup = $create('div');
+                    $setAttr(buttonGroup, 'class', 'ql-html-buttonGroup');
+                    buttonGroup.appendChild(buttonCancel);
+                    buttonGroup.appendChild(buttonOk);
+                    textContainer.appendChild(textArea);
+                    textContainer.appendChild(buttonGroup);
+                    popupContainer.appendChild(textContainer);
+                    overlayContainer.appendChild(popupContainer);
+                    document.body.appendChild(overlayContainer);
+                    buttonCancel.onclick = () => {
+                        document.body.removeChild(overlayContainer);
+                    };
+                    overlayContainer.onclick = buttonCancel.onclick;
+                    popupContainer.onclick = (e) => {
+                        e.preventDefault();
+                        e.stopPropagation();
+                    };
+                    buttonOk.onclick = () => {
+                        const output = textArea.value.split(/\r?\n/g).map((el) => el.trim());
+                        const noNewlines = output.join('');
+                        quill.container.querySelector('.ql-editor').innerHTML = noNewlines;
+                        document.body.removeChild(overlayContainer);
+                    };
+                }
+                function formatHTML(code) {
+                    const whitespace = ' '.repeat(2);
+                    let currentIndent = 0;
+                    const newlineChar = '\n';
+                    let char = null;
+                    let nextChar = null;
+                    let result = '';
+                    for (let pos = 0; pos <= code.length; pos++) {
+                        char = code.substr(pos, 1);
+                        nextChar = code.substr(pos + 1, 1);
+                        const isBrTag = code.substr(pos, 4) === '<br>';
+                        const isOpeningTag = char === '<' && nextChar !== '/' && !isBrTag;
+                        const isClosingTag = char === '<' && nextChar === '/' && !isBrTag;
+                        if (isBrTag) {
+                            result += newlineChar;
+                            currentIndent--;
+                            pos += 4;
+                        }
+                        if (isOpeningTag) {
+                            result += newlineChar + whitespace.repeat(currentIndent);
+                            currentIndent++;
+                        }
+                        else if (isClosingTag) {
+                            if (--currentIndent < 0) {
+                                currentIndent = 0;
+                            }
+                            result += newlineChar + whitespace.repeat(currentIndent);
+                        }
+                        else if (char === ' ' && nextChar === ' ') {
+                            char = '';
+                        }
+                        else if (char === newlineChar) {
+                            if (code.substr(pos, code.substr(pos).indexOf('<')).trim() === '') {
+                                char = '';
+                            }
+                        }
+                        result += char;
+                    }
+                    Logger.log('formatHTML', {
+                        before: code,
+                        after: result
+                    });
+                    return result;
+                }
+                return {
+                    setters: [
+                        function (quill_1_1) {
+                            quill_1 = quill_1_1;
+                        }
+                    ],
+                    execute: function () {
+                        debug = false;
+                        Logger = {
+                            prefixString() {
+                                return `</> quill-html-edit-button: `;
+                            },
+                            get log() {
+                                if (!debug) {
+                                    return () => { };
+                                }
+                                const boundLogFn = console.log.bind(console, this.prefixString());
+                                return boundLogFn;
+                            }
+                        };
+                        QuillHtmlEditPlugin = class QuillHtmlEditPlugin {
+                            constructor(quill, options) {
+                                debug = options && options.debug;
+                                Logger.log('logging enabled');
+                                const toolbarModule = quill.getModule('toolbar');
+                                if (!toolbarModule) {
+                                    throw new Error('quill.htmlEditButton requires the "toolbar" module to be included too');
+                                }
+                                this.registerDivModule();
+                                const toolbarEl = toolbarModule.container;
+                                const buttonContainer = $create('span');
+                                $setAttr(buttonContainer, 'class', 'ql-formats');
+                                const button = $create('button');
+                                button.innerHTML = options.buttonHTML || '&lt;&gt;';
+                                button.title = options.buttonTitle || 'Show HTML source';
+                                button.onclick = (e) => {
+                                    e.preventDefault();
+                                    launchPopupEditor(quill, options);
+                                };
+                                buttonContainer.appendChild(button);
+                                toolbarEl.appendChild(buttonContainer);
+                            }
+                            registerDivModule() {
+                                const Block = quill_1.default.import('blots/block');
+                                class Div extends Block {
+                                }
+                                Div.tagName = 'div';
+                                Div.blotName = 'div';
+                                Div.allowedChildren = Block.allowedChildren;
+                                Div.allowedChildren.push(Block);
+                                quill_1.default.register(Div);
+                            }
+                        };
+                        exports_1("QuillHtmlEditPlugin", QuillHtmlEditPlugin);
+                        exports_1("default", QuillHtmlEditPlugin);
+                    }
+                };
+            });
+
             System.register(["quill", "@stratusjs/core/environment"], function (exports_1, context_1) {
                 var quill_1, environment_1, Break, Embed, QuillBreak;
                 context_1 && context_1.id;
@@ -161176,165 +161437,6 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 };
             });
 
-            System.register(["quill"], function (exports_1, context_1) {
-                var quill_1, debug, Logger, QuillHtmlEditPlugin;
-                context_1 && context_1.id;
-                function $create(elName) {
-                    return document.createElement(elName);
-                }
-                function $setAttr(el, key, value) {
-                    return el.setAttribute(key, value);
-                }
-                function launchPopupEditor(quill, options) {
-                    const htmlFromEditor = quill.container.querySelector('.ql-editor').innerHTML;
-                    const popupContainer = $create('div');
-                    const overlayContainer = $create('div');
-                    const msg = options.msg || 'Edit HTML here, when you click "OK" the quill editor\'s contents will be replaced';
-                    const cancelText = options.cancelText || 'Cancel';
-                    const okText = options.okText || 'Ok';
-                    $setAttr(overlayContainer, 'class', 'ql-html-overlayContainer');
-                    $setAttr(popupContainer, 'class', 'ql-html-popupContainer');
-                    const popupTitle = $create('i');
-                    $setAttr(popupTitle, 'class', 'ql-html-popupTitle');
-                    popupTitle.innerText = msg;
-                    const textContainer = $create('div');
-                    textContainer.appendChild(popupTitle);
-                    $setAttr(textContainer, 'class', 'ql-html-textContainer');
-                    const textArea = $create('textarea');
-                    $setAttr(textArea, 'class', 'ql-html-textArea');
-                    textArea.value = formatHTML(htmlFromEditor);
-                    const buttonCancel = $create('button');
-                    buttonCancel.innerHTML = cancelText;
-                    $setAttr(buttonCancel, 'class', 'ql-html-buttonCancel');
-                    const buttonOk = $create('button');
-                    buttonOk.innerHTML = okText;
-                    const buttonGroup = $create('div');
-                    $setAttr(buttonGroup, 'class', 'ql-html-buttonGroup');
-                    buttonGroup.appendChild(buttonCancel);
-                    buttonGroup.appendChild(buttonOk);
-                    textContainer.appendChild(textArea);
-                    textContainer.appendChild(buttonGroup);
-                    popupContainer.appendChild(textContainer);
-                    overlayContainer.appendChild(popupContainer);
-                    document.body.appendChild(overlayContainer);
-                    buttonCancel.onclick = () => {
-                        document.body.removeChild(overlayContainer);
-                    };
-                    overlayContainer.onclick = buttonCancel.onclick;
-                    popupContainer.onclick = (e) => {
-                        e.preventDefault();
-                        e.stopPropagation();
-                    };
-                    buttonOk.onclick = () => {
-                        const output = textArea.value.split(/\r?\n/g).map((el) => el.trim());
-                        const noNewlines = output.join('');
-                        quill.container.querySelector('.ql-editor').innerHTML = noNewlines;
-                        document.body.removeChild(overlayContainer);
-                    };
-                }
-                function formatHTML(code) {
-                    const whitespace = ' '.repeat(2);
-                    let currentIndent = 0;
-                    const newlineChar = '\n';
-                    let char = null;
-                    let nextChar = null;
-                    let result = '';
-                    for (let pos = 0; pos <= code.length; pos++) {
-                        char = code.substr(pos, 1);
-                        nextChar = code.substr(pos + 1, 1);
-                        const isBrTag = code.substr(pos, 4) === '<br>';
-                        const isOpeningTag = char === '<' && nextChar !== '/' && !isBrTag;
-                        const isClosingTag = char === '<' && nextChar === '/' && !isBrTag;
-                        if (isBrTag) {
-                            result += newlineChar;
-                            currentIndent--;
-                            pos += 4;
-                        }
-                        if (isOpeningTag) {
-                            result += newlineChar + whitespace.repeat(currentIndent);
-                            currentIndent++;
-                        }
-                        else if (isClosingTag) {
-                            if (--currentIndent < 0) {
-                                currentIndent = 0;
-                            }
-                            result += newlineChar + whitespace.repeat(currentIndent);
-                        }
-                        else if (char === ' ' && nextChar === ' ') {
-                            char = '';
-                        }
-                        else if (char === newlineChar) {
-                            if (code.substr(pos, code.substr(pos).indexOf('<')).trim() === '') {
-                                char = '';
-                            }
-                        }
-                        result += char;
-                    }
-                    Logger.log('formatHTML', {
-                        before: code,
-                        after: result
-                    });
-                    return result;
-                }
-                return {
-                    setters: [
-                        function (quill_1_1) {
-                            quill_1 = quill_1_1;
-                        }
-                    ],
-                    execute: function () {
-                        debug = false;
-                        Logger = {
-                            prefixString() {
-                                return `</> quill-html-edit-button: `;
-                            },
-                            get log() {
-                                if (!debug) {
-                                    return () => { };
-                                }
-                                const boundLogFn = console.log.bind(console, this.prefixString());
-                                return boundLogFn;
-                            }
-                        };
-                        QuillHtmlEditPlugin = class QuillHtmlEditPlugin {
-                            constructor(quill, options) {
-                                debug = options && options.debug;
-                                Logger.log('logging enabled');
-                                const toolbarModule = quill.getModule('toolbar');
-                                if (!toolbarModule) {
-                                    throw new Error('quill.htmlEditButton requires the "toolbar" module to be included too');
-                                }
-                                this.registerDivModule();
-                                const toolbarEl = toolbarModule.container;
-                                const buttonContainer = $create('span');
-                                $setAttr(buttonContainer, 'class', 'ql-formats');
-                                const button = $create('button');
-                                button.innerHTML = options.buttonHTML || '&lt;&gt;';
-                                button.title = options.buttonTitle || 'Show HTML source';
-                                button.onclick = (e) => {
-                                    e.preventDefault();
-                                    launchPopupEditor(quill, options);
-                                };
-                                buttonContainer.appendChild(button);
-                                toolbarEl.appendChild(buttonContainer);
-                            }
-                            registerDivModule() {
-                                const Block = quill_1.default.import('blots/block');
-                                class Div extends Block {
-                                }
-                                Div.tagName = 'div';
-                                Div.blotName = 'div';
-                                Div.allowedChildren = Block.allowedChildren;
-                                Div.allowedChildren.push(Block);
-                                quill_1.default.register(Div);
-                            }
-                        };
-                        exports_1("QuillHtmlEditPlugin", QuillHtmlEditPlugin);
-                        exports_1("default", QuillHtmlEditPlugin);
-                    }
-                };
-            });
-
             System.register(["reflect-metadata", "lodash", "@angular/core"], function (exports_1, context_1) {
                 var lodash_1, core_1, RootComponent;
                 context_1 && context_1.id;
@@ -161754,6 +161856,108 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 };
             });
 
+            System.register(["@angular/core", "@stratusjs/angular/froala/view/froala-view.directive"], function (exports_1, context_1) {
+                var __decorate = (this && this.__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;
+                };
+                var FroalaViewModule_1, core_1, froala_view_directive_1, FroalaViewModule;
+                context_1 && context_1.id;
+                return {
+                    setters: [
+                        function (core_1_1) {
+                            core_1 = core_1_1;
+                        },
+                        function (froala_view_directive_1_1) {
+                            froala_view_directive_1 = froala_view_directive_1_1;
+                        }
+                    ],
+                    execute: function () {
+                        FroalaViewModule = FroalaViewModule_1 = class FroalaViewModule {
+                            static forRoot() {
+                                return { ngModule: FroalaViewModule_1, providers: [] };
+                            }
+                        };
+                        FroalaViewModule = FroalaViewModule_1 = __decorate([
+                            core_1.NgModule({
+                                declarations: [froala_view_directive_1.FroalaViewDirective],
+                                exports: [froala_view_directive_1.FroalaViewDirective]
+                            })
+                        ], FroalaViewModule);
+                        exports_1("FroalaViewModule", FroalaViewModule);
+                    }
+                };
+            });
+
+            System.register(["@angular/core"], function (exports_1, context_1) {
+                var __decorate = (this && this.__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;
+                };
+                var __metadata = (this && this.__metadata) || function (k, v) {
+                    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+                };
+                var core_1, FroalaViewDirective;
+                context_1 && context_1.id;
+                return {
+                    setters: [
+                        function (core_1_1) {
+                            core_1 = core_1_1;
+                        }
+                    ],
+                    execute: function () {
+                        FroalaViewDirective = class FroalaViewDirective {
+                            constructor(renderer, element) {
+                                this.renderer = renderer;
+                                this._element = element.nativeElement;
+                            }
+                            set froalaView(content) {
+                                this._element.innerHTML = content;
+                            }
+                            ngAfterViewInit() {
+                                this.renderer.addClass(this._element, 'fr-view');
+                            }
+                        };
+                        __decorate([
+                            core_1.Input(),
+                            __metadata("design:type", String),
+                            __metadata("design:paramtypes", [String])
+                        ], FroalaViewDirective.prototype, "froalaView", null);
+                        FroalaViewDirective = __decorate([
+                            core_1.Directive({
+                                selector: '[froalaView]'
+                            }),
+                            __metadata("design:paramtypes", [core_1.Renderer2, core_1.ElementRef])
+                        ], FroalaViewDirective);
+                        exports_1("FroalaViewDirective", FroalaViewDirective);
+                    }
+                };
+            });
+
+            System.register(["@stratusjs/angular/froala/view/froala-view.directive", "@stratusjs/angular/froala/view/froala-view.module"], function (exports_1, context_1) {
+                context_1 && context_1.id;
+                return {
+                    setters: [
+                        function (froala_view_directive_1_1) {
+                            exports_1({
+                                "FroalaViewDirective": froala_view_directive_1_1["FroalaViewDirective"]
+                            });
+                        },
+                        function (froala_view_module_1_1) {
+                            exports_1({
+                                "FroalaViewModule": froala_view_module_1_1["FroalaViewModule"]
+                            });
+                        }
+                    ],
+                    execute: function () {
+                    }
+                };
+            });
+
             /*!
              * froala_editor v3.2.3 (https://www.froala.com/wysiwyg-editor)
              * License https://froala.com/wysiwyg-editor/terms/
@@ -162180,108 +162384,6 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                 undo: true
             });
 
-            System.register(["@angular/core"], function (exports_1, context_1) {
-                var __decorate = (this && this.__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;
-                };
-                var __metadata = (this && this.__metadata) || function (k, v) {
-                    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-                };
-                var core_1, FroalaViewDirective;
-                context_1 && context_1.id;
-                return {
-                    setters: [
-                        function (core_1_1) {
-                            core_1 = core_1_1;
-                        }
-                    ],
-                    execute: function () {
-                        FroalaViewDirective = class FroalaViewDirective {
-                            constructor(renderer, element) {
-                                this.renderer = renderer;
-                                this._element = element.nativeElement;
-                            }
-                            set froalaView(content) {
-                                this._element.innerHTML = content;
-                            }
-                            ngAfterViewInit() {
-                                this.renderer.addClass(this._element, 'fr-view');
-                            }
-                        };
-                        __decorate([
-                            core_1.Input(),
-                            __metadata("design:type", String),
-                            __metadata("design:paramtypes", [String])
-                        ], FroalaViewDirective.prototype, "froalaView", null);
-                        FroalaViewDirective = __decorate([
-                            core_1.Directive({
-                                selector: '[froalaView]'
-                            }),
-                            __metadata("design:paramtypes", [core_1.Renderer2, core_1.ElementRef])
-                        ], FroalaViewDirective);
-                        exports_1("FroalaViewDirective", FroalaViewDirective);
-                    }
-                };
-            });
-
-            System.register(["@angular/core", "@stratusjs/angular/froala/view/froala-view.directive"], function (exports_1, context_1) {
-                var __decorate = (this && this.__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;
-                };
-                var FroalaViewModule_1, core_1, froala_view_directive_1, FroalaViewModule;
-                context_1 && context_1.id;
-                return {
-                    setters: [
-                        function (core_1_1) {
-                            core_1 = core_1_1;
-                        },
-                        function (froala_view_directive_1_1) {
-                            froala_view_directive_1 = froala_view_directive_1_1;
-                        }
-                    ],
-                    execute: function () {
-                        FroalaViewModule = FroalaViewModule_1 = class FroalaViewModule {
-                            static forRoot() {
-                                return { ngModule: FroalaViewModule_1, providers: [] };
-                            }
-                        };
-                        FroalaViewModule = FroalaViewModule_1 = __decorate([
-                            core_1.NgModule({
-                                declarations: [froala_view_directive_1.FroalaViewDirective],
-                                exports: [froala_view_directive_1.FroalaViewDirective]
-                            })
-                        ], FroalaViewModule);
-                        exports_1("FroalaViewModule", FroalaViewModule);
-                    }
-                };
-            });
-
-            System.register(["@stratusjs/angular/froala/view/froala-view.directive", "@stratusjs/angular/froala/view/froala-view.module"], function (exports_1, context_1) {
-                context_1 && context_1.id;
-                return {
-                    setters: [
-                        function (froala_view_directive_1_1) {
-                            exports_1({
-                                "FroalaViewDirective": froala_view_directive_1_1["FroalaViewDirective"]
-                            });
-                        },
-                        function (froala_view_module_1_1) {
-                            exports_1({
-                                "FroalaViewModule": froala_view_module_1_1["FroalaViewModule"]
-                            });
-                        }
-                    ],
-                    execute: function () {
-                    }
-                };
-            });
-
         })
     };
 }));