sample-cross-fx 0.15.0-beta.4630 → 0.15.0-beta.4670

package/app/{index.469eb3.js → index.972786.js}

@@ -54100,7 +54100,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'span'
+    rootName = 'piral-slot'
   } = config;
   (0,aurelia_pal_browser__WEBPACK_IMPORTED_MODULE_1__.initialize)();
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_2__.createExtension)(rootName);
@@ -54891,7 +54891,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'slot'
+    rootName = 'piral-slot'
   } = config;
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_0__.createExtension)(rootName);
 
@@ -55029,7 +55029,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'slot'
+    rootName = 'piral-slot'
   } = config;
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_0__.createExtension)(rootName);
 
@@ -55391,7 +55391,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'slot'
+    rootName = 'piral-slot'
   } = config;
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_1__.createExtension)(rootName);
 
@@ -55672,16 +55672,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "RoutingService": () => (/* binding */ RoutingService)
 /* harmony export */ });
-/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! tslib */ "../../../node_modules/tslib/tslib.es6.js");
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! tslib */ "../../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @angular/core */ "../../../node_modules/@angular/core/fesm2020/core.mjs");
-/* harmony import */ var _angular_router__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @angular/router */ "../../../node_modules/@angular/router/fesm2020/router.mjs");
-/* harmony import */ var rxjs_operators__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! rxjs/operators */ "../../../node_modules/rxjs/dist/esm5/internal/operators/filter.js");
+/* harmony import */ var _angular_router__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @angular/router */ "../../../node_modules/@angular/router/fesm2020/router.mjs");
 var RoutingService_1;
 
 
 
 
-
 const ngc = _angular_core__WEBPACK_IMPORTED_MODULE_0__;
 let RoutingService = RoutingService_1 = class RoutingService {
   constructor(context, router, zone) {
@@ -55710,14 +55708,24 @@ let RoutingService = RoutingService_1 = class RoutingService {
           this.zone.run(() => this.router.navigateByUrl(path));
         }
       });
-      this.subscription = this.router.events.pipe((0,rxjs_operators__WEBPACK_IMPORTED_MODULE_1__.filter)(e => e instanceof _angular_router__WEBPACK_IMPORTED_MODULE_2__.NavigationError)).subscribe(e => {
-        const path = e.url;
+      this.subscription = this.router.events.subscribe(e => {
+        if (e instanceof _angular_router__WEBPACK_IMPORTED_MODULE_1__.NavigationError) {
+          const path = e.url;
 
-        if (!this.invalidRoutes.includes(path)) {
-          this.invalidRoutes.push(path);
-        }
+          if (!this.invalidRoutes.includes(path)) {
+            this.invalidRoutes.push(path);
+          }
 
-        nav.push(path);
+          nav.push(path);
+        } else if (e.type === 15) {
+          // consistency check to avoid #535 and other Angular-specific issues
+          const locationUrl = nav.path;
+          const routerUrl = e.routerEvent.url;
+
+          if (routerUrl !== locationUrl) {
+            nav.push(routerUrl);
+          }
+        }
       });
     }
   }
@@ -55730,12 +55738,12 @@ let RoutingService = RoutingService_1 = class RoutingService {
   }
 
 };
-RoutingService.ɵfac = 'ɵɵinject' in ngc ? t => new (t || RoutingService_1)(ngc.ɵɵinject('Context'), ngc.ɵɵinject(_angular_router__WEBPACK_IMPORTED_MODULE_2__.Router, 8), ngc.ɵɵinject(_angular_core__WEBPACK_IMPORTED_MODULE_0__.NgZone, 8)) : undefined;
+RoutingService.ɵfac = 'ɵɵinject' in ngc ? t => new (t || RoutingService_1)(ngc.ɵɵinject('Context'), ngc.ɵɵinject(_angular_router__WEBPACK_IMPORTED_MODULE_1__.Router, 8), ngc.ɵɵinject(_angular_core__WEBPACK_IMPORTED_MODULE_0__.NgZone, 8)) : undefined;
 RoutingService.ɵprov = 'ɵɵngDeclareInjectable' in ngc ? ngc.ɵɵdefineInjectable({
   token: RoutingService_1,
   factory: RoutingService_1.ɵfac
 }) : undefined;
-RoutingService = RoutingService_1 = (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__decorate)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Injectable)(), (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__param)(0, (0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Inject)('Context')), (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__param)(1, (0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Optional)()), (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__param)(2, (0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Optional)()), (0,tslib__WEBPACK_IMPORTED_MODULE_3__.__metadata)("design:paramtypes", [Object, _angular_router__WEBPACK_IMPORTED_MODULE_2__.Router, _angular_core__WEBPACK_IMPORTED_MODULE_0__.NgZone])], RoutingService);
+RoutingService = RoutingService_1 = (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__decorate)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Injectable)(), (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__param)(0, (0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Inject)('Context')), (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__param)(1, (0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Optional)()), (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__param)(2, (0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Optional)()), (0,tslib__WEBPACK_IMPORTED_MODULE_2__.__metadata)("design:paramtypes", [Object, _angular_router__WEBPACK_IMPORTED_MODULE_1__.Router, _angular_core__WEBPACK_IMPORTED_MODULE_0__.NgZone])], RoutingService);
 
 
 if ('ɵsetClassMetadata' in ngc) {
@@ -55751,7 +55759,7 @@ if ('ɵsetClassMetadata' in ngc) {
       args: ['Context']
     }]
   }, {
-    type: _angular_router__WEBPACK_IMPORTED_MODULE_2__.Router,
+    type: _angular_router__WEBPACK_IMPORTED_MODULE_1__.Router,
     decorators: [{
       type: _angular_core__WEBPACK_IMPORTED_MODULE_0__.Optional
     }]
@@ -56403,7 +56411,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'slot'
+    rootName = 'piral-slot'
   } = config;
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_1__.createExtension)(rootName);
 
@@ -56531,7 +56539,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'slot'
+    rootName = 'piral-slot'
   } = config;
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_0__.createExtension)(rootName);
 
@@ -56881,7 +56889,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'slot'
+    rootName = 'piral-slot'
   } = config;
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_0__.createExtension)(rootName);
 
@@ -57132,7 +57140,7 @@ __webpack_require__.r(__webpack_exports__);
 
 function createConverter(config = {}) {
   const {
-    rootName = 'slot',
+    rootName = 'piral-slot',
     selector = 'extension-component'
   } = config;
   const Extension = (0,_extension__WEBPACK_IMPORTED_MODULE_0__.createExtension)(rootName, selector);
@@ -59628,8 +59636,8 @@ class ForeignComponentContainer extends react__WEBPACK_IMPORTED_MODULE_0__.Compo
     const {
       $portalId
     } = this.props;
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
-      "data-portal-id": $portalId,
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("piral-portal", {
+      pid: $portalId,
       ref: this.setNode
     });
   }
@@ -60867,6 +60875,16 @@ __webpack_require__.r(__webpack_exports__);
 
 
 if (typeof window !== 'undefined' && 'customElements' in window) {
+  /**
+   * This is a nice abstraction allowing anyone to actually use the extension system
+   * brought by Piral. Not all props of the extension system are actually exposed.
+   *
+   * Usage:
+   *
+   * ```
+   * <piral-extension name="my-ext-name"></piral-extension>
+   * ```
+   */
   class PiralExtension extends HTMLElement {
     constructor() {
       super(...arguments);
@@ -60908,6 +60926,8 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
     }
 
     connectedCallback() {
+      this.style.display = 'contents';
+
       if (this.isConnected) {
         this.dispatchEvent(new CustomEvent('render-html', {
           bubbles: true,
@@ -60943,7 +60963,46 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
 
   }
 
-  customElements.define('piral-extension', PiralExtension);
+  customElements.define(_utils__WEBPACK_IMPORTED_MODULE_2__.extensionName, PiralExtension);
+  /**
+   * This is a boundary to host elements from other frameworks - effectively vanishing
+   * at runtime.
+   *
+   * Usage:
+   *
+   * ```
+   * <piral-portal pid="host-1234"></piral-portal>
+   * ```
+   */
+
+  class PiralPortal extends HTMLElement {
+    connectedCallback() {
+      this.style.display = 'contents';
+    }
+
+  }
+
+  customElements.define(_utils__WEBPACK_IMPORTED_MODULE_2__.portalName, PiralPortal);
+  /**
+   * This is a virtual element to aggregate rendering from other frameworks, mostly
+   * used like piral-portal, but without context-hosting capabilities. This would
+   * be used exclusively within a foreign framework, not from Piral to initiate.
+   *
+   * Usage:
+   *
+   * ```
+   * <piral-slot></piral-slot>
+   * ```
+   */
+
+  class PiralSlot extends HTMLElement {
+    connectedCallback() {
+      this.style.display = 'contents';
+    }
+
+  }
+
+  customElements.define(_utils__WEBPACK_IMPORTED_MODULE_2__.slotName, PiralSlot);
 }
 
 function renderElement(context, element, props) {
@@ -61340,7 +61399,7 @@ const SlotCarrier = ({
   }, [nodes]);
 
   if (nodes.length) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("slot", {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("piral-slot", {
       ref: host
     });
   }
@@ -61387,13 +61446,19 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "attachDomPortal": () => (/* binding */ attachDomPortal),
 /* harmony export */   "changeDomPortal": () => (/* binding */ changeDomPortal),
 /* harmony export */   "convertComponent": () => (/* binding */ convertComponent),
-/* harmony export */   "renderInDom": () => (/* binding */ renderInDom)
+/* harmony export */   "extensionName": () => (/* binding */ extensionName),
+/* harmony export */   "portalName": () => (/* binding */ portalName),
+/* harmony export */   "renderInDom": () => (/* binding */ renderInDom),
+/* harmony export */   "slotName": () => (/* binding */ slotName)
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "../../../node_modules/react/index.js");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "../../../node_modules/react-dom/index.js");
 
 
+const extensionName = 'piral-extension';
+const portalName = 'piral-portal';
+const slotName = 'piral-slot';
 function attachDomPortal(id, context, element, component, props) {
   const portal = /*#__PURE__*/(0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)( /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(component, props), element);
   context.showPortal(id, portal);
@@ -61412,11 +61477,11 @@ function convertComponent(converter, component) {
   return converter(component);
 }
 function renderInDom(context, element, component, props) {
-  const portalId = 'data-portal-id';
+  const portalId = 'pid';
   let parent = element;
 
   while (parent) {
-    if (parent instanceof Element && parent.hasAttribute(portalId)) {
+    if (parent instanceof Element && parent.localName === portalName && parent.hasAttribute(portalId)) {
       const id = parent.getAttribute(portalId);
       return attachDomPortal(id, context, element, component, props);
     }
@@ -62382,7 +62447,7 @@ function installPiralDebug(options) {
       label: 'State container logging',
 
       onChange(value) {
-        setValue('dbg:view-state', value ? 'on' : 'off');
+        setValue(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.viewState, value ? 'on' : 'off');
       }
 
     },
@@ -62392,7 +62457,7 @@ function installPiralDebug(options) {
       label: 'Load available pilets',
 
       onChange(value) {
-        setValue('dbg:load-pilets', value ? 'on' : 'off');
+        setValue(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.loadPilets, value ? 'on' : 'off');
       }
 
     },
@@ -62402,7 +62467,7 @@ function installPiralDebug(options) {
       label: 'Full refresh on change',
 
       onChange(value) {
-        setValue('dbg:hard-refresh', value ? 'on' : 'off');
+        setValue(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.hardRefresh, value ? 'on' : 'off');
       }
 
     },
@@ -62412,7 +62477,7 @@ function installPiralDebug(options) {
       label: 'Visualize component origins',
 
       onChange(value, prev) {
-        setValue('dbg:view-origins', value ? 'on' : 'off');
+        setValue(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.viewOrigins, value ? 'on' : 'off');
 
         if (prev !== value) {
           updateVisualize(value);
@@ -62426,7 +62491,7 @@ function installPiralDebug(options) {
       label: 'Enable extension catalogue',
 
       onChange(value) {
-        setValue('dbg:extension-catalogue', value ? 'on' : 'off');
+        setValue(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.extensionCatalogue, value ? 'on' : 'off');
       }
 
     },
@@ -62436,7 +62501,7 @@ function installPiralDebug(options) {
       label: 'Clear console during HMR',
 
       onChange(value) {
-        setValue('dbg:clear-console', value ? 'on' : 'off');
+        setValue(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.clearConsole, value ? 'on' : 'off');
       }
 
     },
@@ -62601,12 +62666,12 @@ function installPiralDebug(options) {
     debug: debugApiVersion,
     instance: {
       name: "sample-cross-fx",
-      version: "0.15.0-beta.4630",
+      version: "0.15.0-beta.4670",
       dependencies: "@angular/common,@angular/compiler,@angular/core,@angular/platform-browser,@angular/platform-browser-dynamic,@webcomponents/webcomponentsjs,angular,aurelia-framework,aurelia-templating-binding,aurelia-templating-resources,aurelia-pal-browser,aurelia-event-aggregator,aurelia-history-browser,hyperapp,inferno,inferno-create-element,mithril,lit-element,solid-js,solid-js/dom,piral-ng/common,preact,riot,rxjs,vue,zone.js,tslib,react,react-dom,react-router,react-router-dom"
     },
     build: {
-      date: "2022-08-29T23:57:16.873Z",
-      cli: "0.14.30",
+      date: "2022-09-20T22:37:11.613Z",
+      cli: "0.14.31",
       compat: "0.14"
     }
   };
@@ -62714,11 +62779,12 @@ function installPiralDebug(options) {
     if (!legacyBrowser && event.storageArea === sessionStorage) {
       // potentially unknowingly updated settings
       updateSettings({
-        viewState: sessionStorage.getItem('dbg:view-state') !== 'off',
-        loadPilets: sessionStorage.getItem('dbg:load-pilets') === 'on',
-        hardRefresh: sessionStorage.getItem('dbg:hard-refresh') === 'on',
-        viewOrigins: sessionStorage.getItem('dbg:view-origins') === 'on',
-        extensionCatalogue: sessionStorage.getItem('dbg:extension-catalogue') !== 'off'
+        viewState: sessionStorage.getItem(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.viewState) !== 'off',
+        loadPilets: sessionStorage.getItem(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.loadPilets) === 'on',
+        hardRefresh: sessionStorage.getItem(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.hardRefresh) === 'on',
+        viewOrigins: sessionStorage.getItem(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.viewOrigins) === 'on',
+        extensionCatalogue: sessionStorage.getItem(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.extensionCatalogue) !== 'off',
+        clearConsole: sessionStorage.getItem(_state__WEBPACK_IMPORTED_MODULE_0__.settingsKeys.clearConsole) === 'on'
       });
     }
   });
@@ -63018,13 +63084,23 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "navigate": () => (/* binding */ navigate),
 /* harmony export */   "setNavigate": () => (/* binding */ setNavigate),
 /* harmony export */   "setState": () => (/* binding */ setState),
+/* harmony export */   "settingsKeys": () => (/* binding */ settingsKeys),
 /* harmony export */   "subscribe": () => (/* binding */ subscribe),
 /* harmony export */   "useDebugState": () => (/* binding */ useDebugState)
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "../../../node_modules/react/index.js");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 
-const persistKey = 'dbg:persist-settings-data';
+const settingsKeys = {
+  viewState: 'dbg:view-state',
+  loadPilets: 'dbg:load-pilets',
+  hardRefresh: 'dbg:hard-refresh',
+  viewOrigins: 'dbg:view-origins',
+  extensionCatalogue: 'dbg:extension-catalogue',
+  clearConsole: 'dbg:clear-console',
+  persistSettings: 'dbg:persist-settings-data'
+};
+const persistKey = settingsKeys.persistSettings;
 const persistSettings = !!localStorage.getItem(persistKey);
 
 const defaultSetter = (name, value) => {
@@ -63053,11 +63129,15 @@ if (persistSettings) {
 
 function enablePersistance() {
   const data = {};
+  const validKeys = Object.keys(settingsKeys).map(m => settingsKeys[m]);
 
   for (let i = 0; i < sessionStorage.length; i++) {
     const name = sessionStorage.key(i);
-    const value = sessionStorage.getItem(name);
-    data[name] = value;
+
+    if (validKeys.includes(name)) {
+      const value = sessionStorage.getItem(name);
+      data[name] = value;
+    }
   }
 
   localStorage.setItem(persistKey, JSON.stringify(data));
@@ -63069,12 +63149,12 @@ function disablePersistance() {
 }
 const initialSetter = persistSettings ? persistentSetter : defaultSetter;
 const initialSettings = {
-  viewState: sessionStorage.getItem('dbg:view-state') !== 'off',
-  loadPilets: sessionStorage.getItem('dbg:load-pilets') === 'on',
-  hardRefresh: sessionStorage.getItem('dbg:hard-refresh') === 'on',
-  viewOrigins: sessionStorage.getItem('dbg:view-origins') === 'on',
-  extensionCatalogue: sessionStorage.getItem('dbg:extension-catalogue') !== 'off',
-  clearConsole: sessionStorage.getItem('dbg:clear-console') === 'on',
+  viewState: sessionStorage.getItem(settingsKeys.viewState) !== 'off',
+  loadPilets: sessionStorage.getItem(settingsKeys.loadPilets) === 'on',
+  hardRefresh: sessionStorage.getItem(settingsKeys.hardRefresh) === 'on',
+  viewOrigins: sessionStorage.getItem(settingsKeys.viewOrigins) === 'on',
+  extensionCatalogue: sessionStorage.getItem(settingsKeys.extensionCatalogue) !== 'off',
+  clearConsole: sessionStorage.getItem(settingsKeys.clearConsole) === 'on',
   persistSettings,
   cataloguePath: '/$debug-extension-catalogue'
 };
@@ -74445,6 +74525,13 @@ __webpack_require__.r(__webpack_exports__);
         });
 
         return {
+          get path() {
+            if (_nav) {
+              return _nav.location.pathname;
+            }
+
+            return location.pathname;
+          },
           push(target, state) {
             if (_nav) {
               _nav.push(target, state);
@@ -211153,4 +211240,4 @@ root.render( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_8__.createElement(piral
 
 /******/ })()
 ;
-//# sourceMappingURL=index.469eb3.js.map
+//# sourceMappingURL=index.972786.js.map