universal-router-outlet/lib/universal-router-outlet.js

Use universal router in a web components app. Router outlet will take care of updating the right components when the url route changes

module.exports=function(t){var e={};function o(u){if(e[u])return e[u].exports;var n=e[u]={i:u,l:!1,exports:{}};return t[u].call(n.exports,n,n.exports,o),n.l=!0,n.exports}return o.m=t,o.c=e,o.d=function(t,e,u){o.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:u})},o.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return o.d(e,"a",e),e},o.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},o.p="/",o(o.s=1)}([function(t,e,o){"use strict";Object.defineProperty(e,"__esModule",{value:!0});e.updateRouterOutlet=function(t,e,o){if(void 0===e){if(t.querySelector(o))return;return void(t.innerHTML=o?`<${o}></${o}>`:"")}let{component:u}=e,n=t.querySelector(u);n&&null!==n||(t.innerHTML=`<${u}></${u}>`)};e.getRouteTitle=function(t){return console.warn("Implement getRouteTitle()"),"Test title"};e.addIdsToRouteData=function(t){e(t);function e(t){t.children&&t.children.forEach(o=>{o.outletId=t.component,e(o)})}}},function(t,e,o){"use strict";Object.defineProperty(e,"__esModule",{value:!0});const u=o(0),n=o(2);class r extends HTMLElement{constructor(){super(),this.outletid=this.parentElement.nodeName.toLocaleLowerCase(),this.handleRouteResolve=(()=>{this.routeData=n.getRouteData(this.outletid),u.updateRouterOutlet(this,this.routeData,this.default)})}connectedCallback(){this.routeData=n.getRouteData(this.outletid),this.routeData&&u.updateRouterOutlet(this,this.routeData,this.default),document.addEventListener("RouteResolved",this.handleRouteResolve)}disconnectedCallback(){document.removeEventListener("RouteResolved",this.handleRouteResolve)}static get observedAttributes(){return["outletid","default"]}attributeChangedCallback(t,e,o){this[t]=o}}window.customElements.define("router-outlet",r),t.exports={RouterOutlet:r,getRouteData:n.getRouteData,setRouteData:n.setRouteData,getRouteTitle:u.getRouteTitle,updateRouterOutlet:u.updateRouterOutlet}},function(t,e,o){"use strict";Object.defineProperty(e,"__esModule",{value:!0});const u=o(0);e.setRouteData=function(t){n={component:"body",children:t},u.addIdsToRouteData(n);let e=new CustomEvent("RouteResolved",{detail:n});document.dispatchEvent(e)};e.getRouteData=function(t){let e,o,u=[];if(n){for(u.push(n);u.length>0;){if((e=u.pop()).outletId===t){o=e;break}e.children&&e.children.length&&u.push(...e.children)}return o}};let n}]);