@luigi-project/container - npm Package Compare versions

Comparing version 0.0.9 to 0.9.1

bundle.js

@@ -1,2 +0,2 @@
-function e(){}function t(e){return e()}function n(){return Object.create(null)}function o(e){e.forEach(t)}function r(e){return"function"==typeof e}function i(e,t){return e!=e?t==t:e!==t||e&&"object"==typeof e||"function"==typeof e}let s,c;function a(e,t){return s||(s=document.createElement("a")),s.href=t,e===s.href}function u(e,t,n){e.insertBefore(t,n||null)}function l(e){e.parentNode.removeChild(e)}function d(e){return document.createElement(e)}function m(){return e="",document.createTextNode(e);var e}function h(e,t,n){null==n?e.removeAttribute(t):e.getAttribute(t)!==n&&e.setAttribute(t,n)}function p(e){const t={};for(const n of e)t[n.name]=n.value;return t}function g(e){c=e}function f(){if(!c)throw new Error("Function called outside component initialization");return c}function C(e){f().$$.on_mount.push(e)}const w=[],b=[],$=[],v=[],_=Promise.resolve();let x=!1;function y(e){$.push(e)}const E=new Set;let W=0;function I(){const e=c;do{for(;W<w.length;){const e=w[W];W++,g(e),U(e.$$)}for(g(null),w.length=0,W=0;b.length;)b.pop()();for(let e=0;e<$.length;e+=1){const t=$[e];E.has(t)||(E.add(t),t())}$.length=0}while(w.length);for(;v.length;)v.pop()();x=!1,E.clear(),g(e)}function U(e){if(null!==e.fragment){e.update(),o(e.before_update);const t=e.dirty;e.dirty=[-1],e.fragment&&e.fragment.p(e.ctx,t),e.after_update.forEach(y)}}const R=new Set;function L(e,t){-1===e.$$.dirty[0]&&(w.push(e),x||(x=!0,_.then(I)),e.$$.dirty.fill(0)),e.$$.dirty[t/31|0]|=1<<t%31}function k(i,s,a,u,d,m,h,p=[-1]){const f=c;g(i);const C=i.$$={fragment:null,ctx:null,props:m,update:e,not_equal:d,bound:n(),on_mount:[],on_destroy:[],on_disconnect:[],before_update:[],after_update:[],context:new Map(s.context||(f?f.$$.context:[])),callbacks:n(),dirty:p,skip_bound:!1,root:s.target||f.$$.root};h&&h(C.root);let w=!1;if(C.ctx=a?a(i,s.props||{},((e,t,...n)=>{const o=n.length?n[0]:t;return C.ctx&&d(C.ctx[e],C.ctx[e]=o)&&(!C.skip_bound&&C.bound[e]&&C.bound[e](o),w&&L(i,e)),t})):[],C.update(),w=!0,o(C.before_update),C.fragment=!!u&&u(C.ctx),s.target){if(s.hydrate){const e=function(e){return Array.from(e.childNodes)}(s.target);C.fragment&&C.fragment.l(e),e.forEach(l)}else C.fragment&&C.fragment.c();s.intro&&((b=i.$$.fragment)&&b.i&&(R.delete(b),b.i($))),function(e,n,i,s){const{fragment:c,on_mount:a,on_destroy:u,after_update:l}=e.$$;c&&c.m(n,i),s||y((()=>{const n=a.map(t).filter(r);u?u.push(...n):o(n),e.$$.on_mount=[]})),l.forEach(y)}(i,s.target,s.anchor,s.customElement),I()}var b,$;g(f)}let M;"function"==typeof HTMLElement&&(M=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){const{on_mount:e}=this.$$;this.$$.on_disconnect=e.map(t).filter(r);for(const e in this.$$.slotted)this.appendChild(this.$$.slotted[e])}attributeChangedCallback(e,t,n){this[e]=n}disconnectedCallback(){o(this.$$.on_disconnect)}$destroy(){!function(e,t){const n=e.$$;null!==n.fragment&&(o(n.on_destroy),n.fragment&&n.fragment.d(t),n.on_destroy=n.fragment=null,n.ctx=[])}(this,1),this.$destroy=e}$on(e,t){const n=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return n.push(t),()=>{const e=n.indexOf(t);-1!==e&&n.splice(e,1)}}$set(e){var t;this.$$set&&(t=e,0!==Object.keys(t).length)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}});class A{constructor(){}isVisible(e){return!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)}dispatch(e,t,n,o){let r=new CustomEvent(e,{detail:n});r.luigiCallback=e=>{o&&o(e)},t.dispatchEvent(r)}getTargetContainer(e){let t;return globalThis.__luigi_container_manager.container.forEach((n=>{var o;(null===(o=n.iframeHandle)||void 0===o?void 0:o.iframe)&&n.iframeHandle.iframe.contentWindow===e.source&&(t=n)})),t}getContainerManager(){return globalThis.__luigi_container_manager||(globalThis.__luigi_container_manager={container:[],messageListener:e=>{var t,n,o,r;const i=this.getTargetContainer(e),s=null===(n=null===(t=null==i?void 0:i.iframeHandle)||void 0===t?void 0:t.iframe)||void 0===n?void 0:n.contentWindow;if(s===e.source&&0===(null===(r=null===(o=e.data)||void 0===o?void 0:o.msg)||void 0===r?void 0:r.indexOf("luigi."))){const t=e.data.msg;switch(t){case"luigi.get-context":s.postMessage({msg:"luigi.init",context:i.context,internal:{}},"*");break;case"luigi.navigation.open":this.dispatch("navigation-request",i,e.data.params);break;case"luigi.ux.alert.show":this.dispatch("alert-request",i,e.data.params);break;default:console.warn("Functionality not yet implemented: ",t)}}}},window.addEventListener("message",globalThis.__luigi_container_manager.messageListener)),globalThis.__luigi_container_manager}registerContainer(e){this.getContainerManager().container.push(e)}}class O{constructor(e){e?(this.rendererObject=e,this.config=e.config||{}):this.config={}}createCompoundContainer(){return document.createElement("div")}createCompoundItemContainer(e){return document.createElement("div")}attachCompoundItem(e,t){e.appendChild(t)}}class P extends O{constructor(e){super(e||{use:{}}),e&&e.use&&e.use.extends&&(this.superRenderer=H({use:e.use.extends,config:e.config}))}createCompoundContainer(){return this.rendererObject.use.createCompoundContainer?this.rendererObject.use.createCompoundContainer(this.config,this.superRenderer):this.superRenderer?this.superRenderer.createCompoundContainer():super.createCompoundContainer()}createCompoundItemContainer(e){return this.rendererObject.use.createCompoundItemContainer?this.rendererObject.use.createCompoundItemContainer(e,this.config,this.superRenderer):this.superRenderer?this.superRenderer.createCompoundItemContainer(e):super.createCompoundItemContainer(e)}attachCompoundItem(e,t){this.rendererObject.use.attachCompoundItem?this.rendererObject.use.attachCompoundItem(e,t,this.superRenderer):this.superRenderer?this.superRenderer.attachCompoundItem(e,t):super.attachCompoundItem(e,t)}}class T extends O{createCompoundContainer(){const e="__lui_compound_"+(new Date).getTime(),t=document.createElement("div");t.classList.add(e);let n="";return this.config.layouts&&this.config.layouts.forEach((t=>{if(t.minWidth||t.maxWidth){let o="@media only screen ";null!=t.minWidth&&(o+=`and (min-width: ${t.minWidth}px) `),null!=t.maxWidth&&(o+=`and (max-width: ${t.maxWidth}px) `),o+=`{\n            .${e} {\n              grid-template-columns: ${t.columns||"auto"};\n              grid-template-rows: ${t.rows||"auto"};\n              grid-gap: ${t.gap||"0"};\n            }\n          }\n          `,n+=o}})),t.innerHTML=`\n        <style scoped>\n          .${e} {\n            display: grid;\n            grid-template-columns: ${this.config.columns||"auto"};\n            grid-template-rows: ${this.config.rows||"auto"};\n            grid-gap: ${this.config.gap||"0"};\n            min-height: ${this.config.minHeight||"auto"};\n          }\n          ${n}\n        </style>\n    `,t}createCompoundItemContainer(e){const t=e||{},n=document.createElement("div");return n.setAttribute("style",`grid-row: ${t.row||"auto"}; grid-column: ${t.column||"auto"}`),n}}const H=e=>{const t=e.use;return t?"grid"===t?new T(e):t.createCompoundContainer||t.createCompoundItemContainer||t.attachCompoundItem?new P(e):new O(e):new O(e)},j=(e,t,n,o)=>{(null==t?void 0:t.eventListeners)&&t.eventListeners.forEach((t=>{const r=t.source+"."+t.name,i=e[r],s={wcElementId:n,wcElement:o,action:t.action,converter:t.dataConverter};i?i.push(s):e[r]=[s]}))};class S{constructor(){this.containerService=new A}dynamicImport(e){return import(/* webpackIgnore: true */ e)}processViewUrl(e,t){return e}attachWC(e,t,n,o,r,i){if(n&&n.contains(t)){const s=document.createElement(e);i&&s.setAttribute("nodeId",i),this.initWC(s,e,n,r,o,i),n.replaceChild(s,t)}}createClientAPI(e,t,n){return{linkManager:()=>{},uxManager:()=>({showAlert:e=>{},showConfirmationModal:async e=>new Promise(((e,t)=>{e(!0)}))}),getCurrentLocale:()=>{},publishEvent:e=>{}}}initWC(e,t,n,o,r,i){const s=this.createClientAPI(n,i,t);if(e.__postProcess){const t=new URL(document.baseURI).origin===new URL(o,document.baseURI).origin?new URL("./",new URL(o,document.baseURI)):new URL("./",o);e.__postProcess(r,s,t.origin+t.pathname)}else e.context=r,e.LuigiClient=s}generateWCId(e){let t="";for(let n=0;n<e.length;n++)t+=e.charCodeAt(n).toString(16);return"luigi-wc-"+t}registerWCFromUrl(e,t){const n=this.processViewUrl(e);return new Promise(((e,o)=>{this.checkWCUrl(n)?this.dynamicImport(n).then((n=>{try{if(!window.customElements.get(t)){let e=n.default;if(!HTMLElement.isPrototypeOf(e)){let t=Object.keys(n);for(let o=0;o<t.length&&(e=n[t[o]],!HTMLElement.isPrototypeOf(e));o++);}window.customElements.define(t,e)}e(1)}catch(e){o(e)}})).catch((e=>o(e))):(console.warn(`View URL '${n}' not allowed to be included`),o(`View URL '${n}' not allowed`))}))}includeSelfRegisteredWCFromUrl(e,t,n){if(this.checkWCUrl(t)){this.containerService.getContainerManager()._registerWebcomponent||(this.containerService.getContainerManager()._registerWebcomponent=(e,t)=>{window.customElements.define(this.generateWCId(e),t)});let o=document.createElement("script");o.setAttribute("src",t),"module"===e.webcomponent.type&&o.setAttribute("type","module"),o.setAttribute("defer","true"),o.addEventListener("load",(()=>{n()})),document.body.appendChild(o)}else console.warn(`View URL '${t}' not allowed to be included`)}checkWCUrl(e){return!0}renderWebComponent(e,t,n,o,r){const i=this.processViewUrl(e,{context:n}),s=o.webcomponent&&o.webcomponent.tagName?o.webcomponent.tagName:this.generateWCId(i),c=document.createElement("div");t.appendChild(c),t._luigi_node=o,window.customElements.get(s)?this.attachWC(s,c,t,n,i,r):window.luigiWCFn?window.luigiWCFn(i,s,c,(()=>{this.attachWC(s,c,t,n,i,r)})):o.webcomponent&&o.webcomponent.selfRegistered?this.includeSelfRegisteredWCFromUrl(o,i,(()=>{this.attachWC(s,c,t,n,i,r)})):this.registerWCFromUrl(i,s).then((()=>{this.attachWC(s,c,t,n,i,r)}))}createCompoundContainerAsync(e,t){return new Promise(((n,o)=>{if(e.viewUrl)try{const o=this.generateWCId(e.viewUrl);this.registerWCFromUrl(e.viewUrl,o).then((()=>{const r=document.createElement(o);this.initWC(r,o,r,e.viewUrl,t,"_root"),n(r)}))}catch(e){o(e)}else n(e.createCompoundContainer())}))}renderWebComponentCompound(e,t,n){var o;let r;return e.webcomponent&&e.viewUrl?(r=new O,r.viewUrl=this.processViewUrl(e.viewUrl,{context:n}),r.createCompoundItemContainer=e=>{var t=document.createElement("div");return e&&e.slot&&t.setAttribute("slot",e.slot),t}):(null===(o=e.compound)||void 0===o?void 0:o.renderer)&&(r=H(e.compound.renderer)),r=r||new O,new Promise((o=>{this.createCompoundContainerAsync(r,n).then((i=>{var s;const c={};i.eventBus={listeners:c,onPublishEvent:(e,t,n)=>{const o=c[t+"."+e.type]||[];o.push(...c["*."+e.type]||[]),o.forEach((t=>{const n=t.wcElement||i.querySelector("[nodeId="+t.wcElementId+"]");n?n.dispatchEvent(new CustomEvent(t.action,{detail:t.converter?t.converter(e.detail):e.detail})):console.debug("Could not find event target",t)}))}},null===(s=e.compound)||void 0===s||s.children.forEach(((e,t)=>{const o=Object.assign(Object.assign({},n),e.context),s=r.createCompoundItemContainer(e.layoutConfig);s.eventBus=i.eventBus,r.attachCompoundItem(i,s);const a=e.id||"gen_"+t;this.renderWebComponent(e.viewUrl,s,o,e,a),j(c,e,a)})),t.appendChild(i),j(c,e.compound,"_root",i),o(i)}))}))}}function q(e){let t,n=!e[5](),o=n&&function(e){let t,n;return{c(){t=d("iframe"),a(t.src,n=e[0])||h(t,"src",n),h(t,"title",e[1])},m(n,o){u(n,t,o),e[8](t)},p(e,o){1&o&&!a(t.src,n=e[0])&&h(t,"src",n),2&o&&h(t,"title",e[1])},d(n){n&&l(t),e[8](null)}}}(e);return{c(){o&&o.c(),t=m()},m(e,n){o&&o.m(e,n),u(e,t,n)},p(e,t){n&&o.p(e,t)},d(e){o&&o.d(e),e&&l(t)}}}function F(t){let n,o=!t[4]&&q(t);return{c(){n=d("main"),o&&o.c(),this.c=e,h(n,"class",t[5]()?void 0:"lui-isolated")},m(e,r){u(e,n,r),o&&o.m(n,null),t[9](n)},p(e,[t]){e[4]?o&&(o.d(1),o=null):o?o.p(e,t):(o=q(e),o.c(),o.m(n,null))},i:e,o:e,d(e){e&&l(n),o&&o.d(),t[9](null)}}}function V(e,t,n){let o,{viewurl:r}=t,{context:i}=t,{label:s}=t,{webcomponent:c}=t,a={};const u=new A,l=new S;l.createClientAPI=(e,t,n)=>({linkManager:()=>({navigate:e=>{h("navigation-request",{link:e})}}),uxManager:()=>({showAlert:e=>{h("alert-request",e)},showConfirmationModal:async e=>new Promise(((t,n)=>{h("confirmation-request",e,(e=>{e?t(e):n()}))}))}),getCurrentLocale:()=>{},publishEvent:e=>{}});const d=f();d.iframeHandle=a;let m=!!d.attributes["defer-init"];function h(e,t,n){u.dispatch(e,d,t,n)}function p(){return!!c}var g;return d.init=()=>{n(4,m=!1)},u.registerContainer(d),C((async()=>{const e=i?JSON.parse(i):void 0;p()&&(n(3,o.innerHTML="",o),l.renderWebComponent(r,o,e,{}))})),g=async()=>{},f().$$.on_destroy.push(g),e.$$set=e=>{"viewurl"in e&&n(0,r=e.viewurl),"context"in e&&n(6,i=e.context),"label"in e&&n(1,s=e.label),"webcomponent"in e&&n(7,c=e.webcomponent)},[r,s,a,o,m,p,i,c,function(e){b[e?"unshift":"push"]((()=>{a.iframe=e,n(2,a)}))},function(e){b[e?"unshift":"push"]((()=>{o=e,n(3,o)}))}]}class N extends M{constructor(e){super(),this.shadowRoot.innerHTML="<style>main,iframe{width:100%;height:100%;border:none}main.lui-isolated{line-height:0}</style>",k(this,{target:this.shadowRoot,props:p(this.attributes),customElement:!0},V,F,i,{viewurl:0,context:6,label:1,webcomponent:7},null),e&&(e.target&&u(e.target,this,e.anchor),e.props&&(this.$set(e.props),I()))}static get observedAttributes(){return["viewurl","context","label","webcomponent"]}get viewurl(){return this.$$.ctx[0]}set viewurl(e){this.$$set({viewurl:e}),I()}get context(){return this.$$.ctx[6]}set context(e){this.$$set({context:e}),I()}get label(){return this.$$.ctx[1]}set label(e){this.$$set({label:e}),I()}get webcomponent(){return this.$$.ctx[7]}set webcomponent(e){this.$$set({webcomponent:e}),I()}}function B(t){let n;return{c(){n=d("main"),this.c=e},m(e,o){u(e,n,o),t[2](n)},p:e,i:e,o:e,d(e){e&&l(n),t[2](null)}}}function J(e,t,n){let o,{context:r}=t,i=!1;const s=new A,c=new S;c.createClientAPI=(e,t,n)=>({linkManager:()=>{},uxManager:()=>({showAlert:e=>{u("alert-request",e,{})},showConfirmationModal:async e=>new Promise(((t,n)=>{u("confirmation-request",e,(e=>{e?t(e):n()}))}))}),getCurrentLocale:()=>{},publishEvent:o=>{e&&e.eventBus&&e.eventBus.onPublishEvent(o,t,n)}});const a=f();function u(e,t,n){s.dispatch(e,a,t,n)}return a.attributes["defer-init"],a.init=()=>{if(!a.compoundConfig||i)return;const e={compound:a.compoundConfig};c.renderWebComponentCompound(e,o,r).then((e=>{})),i=!0},s.registerContainer(a),C((async()=>{r&&JSON.parse(r)})),e.$$set=e=>{"context"in e&&n(1,r=e.context)},[o,r,function(e){b[e?"unshift":"push"]((()=>{o=e,n(0,o)}))}]}class z extends M{constructor(e){super(),this.shadowRoot.innerHTML="<style>main{width:100%;height:100%;border:none}</style>",k(this,{target:this.shadowRoot,props:p(this.attributes),customElement:!0},J,B,i,{context:1},null),e&&(e.target&&u(e.target,this,e.anchor),e.props&&(this.$set(e.props),I()))}static get observedAttributes(){return["context"]}get context(){return this.$$.ctx[1]}set context(e){this.$$set({context:e}),I()}}export{z as LuigiCompoundContainer,N as LuigiContainer};
+function e(){}function t(e){return e()}function n(){return Object.create(null)}function o(e){e.forEach(t)}function r(e){return"function"==typeof e}function i(e,t){return e!=e?t==t:e!==t||e&&"object"==typeof e||"function"==typeof e}let s,c;function a(e,t){return s||(s=document.createElement("a")),s.href=t,e===s.href}function u(e,t,n){e.insertBefore(t,n||null)}function l(e){e.parentNode.removeChild(e)}function d(e){return document.createElement(e)}function m(){return e="",document.createTextNode(e);var e}function h(e,t,n){null==n?e.removeAttribute(t):e.getAttribute(t)!==n&&e.setAttribute(t,n)}function p(e){const t={};for(const n of e)t[n.name]=n.value;return t}function g(e){c=e}function f(){if(!c)throw new Error("Function called outside component initialization");return c}function C(e){f().$$.on_mount.push(e)}const w=[],b=[],$=[],v=[],_=Promise.resolve();let x=!1;function y(e){$.push(e)}const E=new Set;let W=0;function I(){const e=c;do{for(;W<w.length;){const e=w[W];W++,g(e),U(e.$$)}for(g(null),w.length=0,W=0;b.length;)b.pop()();for(let e=0;e<$.length;e+=1){const t=$[e];E.has(t)||(E.add(t),t())}$.length=0}while(w.length);for(;v.length;)v.pop()();x=!1,E.clear(),g(e)}function U(e){if(null!==e.fragment){e.update(),o(e.before_update);const t=e.dirty;e.dirty=[-1],e.fragment&&e.fragment.p(e.ctx,t),e.after_update.forEach(y)}}const R=new Set;function L(e,t){-1===e.$$.dirty[0]&&(w.push(e),x||(x=!0,_.then(I)),e.$$.dirty.fill(0)),e.$$.dirty[t/31|0]|=1<<t%31}function k(i,s,a,u,d,m,h,p=[-1]){const f=c;g(i);const C=i.$$={fragment:null,ctx:null,props:m,update:e,not_equal:d,bound:n(),on_mount:[],on_destroy:[],on_disconnect:[],before_update:[],after_update:[],context:new Map(s.context||(f?f.$$.context:[])),callbacks:n(),dirty:p,skip_bound:!1,root:s.target||f.$$.root};h&&h(C.root);let w=!1;if(C.ctx=a?a(i,s.props||{},((e,t,...n)=>{const o=n.length?n[0]:t;return C.ctx&&d(C.ctx[e],C.ctx[e]=o)&&(!C.skip_bound&&C.bound[e]&&C.bound[e](o),w&&L(i,e)),t})):[],C.update(),w=!0,o(C.before_update),C.fragment=!!u&&u(C.ctx),s.target){if(s.hydrate){const e=function(e){return Array.from(e.childNodes)}(s.target);C.fragment&&C.fragment.l(e),e.forEach(l)}else C.fragment&&C.fragment.c();s.intro&&((b=i.$$.fragment)&&b.i&&(R.delete(b),b.i($))),function(e,n,i,s){const{fragment:c,on_mount:a,on_destroy:u,after_update:l}=e.$$;c&&c.m(n,i),s||y((()=>{const n=a.map(t).filter(r);u?u.push(...n):o(n),e.$$.on_mount=[]})),l.forEach(y)}(i,s.target,s.anchor,s.customElement),I()}var b,$;g(f)}let M;"function"==typeof HTMLElement&&(M=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){const{on_mount:e}=this.$$;this.$$.on_disconnect=e.map(t).filter(r);for(const e in this.$$.slotted)this.appendChild(this.$$.slotted[e])}attributeChangedCallback(e,t,n){this[e]=n}disconnectedCallback(){o(this.$$.on_disconnect)}$destroy(){!function(e,t){const n=e.$$;null!==n.fragment&&(o(n.on_destroy),n.fragment&&n.fragment.d(t),n.on_destroy=n.fragment=null,n.ctx=[])}(this,1),this.$destroy=e}$on(e,t){const n=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return n.push(t),()=>{const e=n.indexOf(t);-1!==e&&n.splice(e,1)}}$set(e){var t;this.$$set&&(t=e,0!==Object.keys(t).length)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}});class A{constructor(){}isVisible(e){return!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)}dispatch(e,t,n,o){let r=new CustomEvent(e,{detail:n});r.luigiCallback=e=>{o&&o(e)},t.dispatchEvent(r)}getTargetContainer(e){let t;return globalThis.__luigi_container_manager.container.forEach((n=>{var o;(null===(o=n.iframeHandle)||void 0===o?void 0:o.iframe)&&n.iframeHandle.iframe.contentWindow===e.source&&(t=n)})),t}getContainerManager(){return globalThis.__luigi_container_manager||(globalThis.__luigi_container_manager={container:[],messageListener:e=>{var t,n,o,r;const i=this.getTargetContainer(e),s=null===(n=null===(t=null==i?void 0:i.iframeHandle)||void 0===t?void 0:t.iframe)||void 0===n?void 0:n.contentWindow;if(s===e.source&&0===(null===(r=null===(o=e.data)||void 0===o?void 0:o.msg)||void 0===r?void 0:r.indexOf("luigi."))){const t=e.data.msg;switch(t){case"luigi.get-context":s.postMessage({msg:"luigi.init",context:i.context,internal:{}},"*");break;case"luigi.navigation.open":this.dispatch("navigation-request",i,e.data.params);break;case"luigi.ux.alert.show":this.dispatch("alert-request",i,e.data.params);break;default:console.warn("Functionality not yet implemented: ",t)}}}},window.addEventListener("message",globalThis.__luigi_container_manager.messageListener)),globalThis.__luigi_container_manager}registerContainer(e){this.getContainerManager().container.push(e)}}class O{constructor(e){e?(this.rendererObject=e,this.config=e.config||{}):this.config={}}createCompoundContainer(){return document.createElement("div")}createCompoundItemContainer(e){return document.createElement("div")}attachCompoundItem(e,t){e.appendChild(t)}}class P extends O{constructor(e){super(e||{use:{}}),e&&e.use&&e.use.extends&&(this.superRenderer=H({use:e.use.extends,config:e.config}))}createCompoundContainer(){return this.rendererObject.use.createCompoundContainer?this.rendererObject.use.createCompoundContainer(this.config,this.superRenderer):this.superRenderer?this.superRenderer.createCompoundContainer():super.createCompoundContainer()}createCompoundItemContainer(e){return this.rendererObject.use.createCompoundItemContainer?this.rendererObject.use.createCompoundItemContainer(e,this.config,this.superRenderer):this.superRenderer?this.superRenderer.createCompoundItemContainer(e):super.createCompoundItemContainer(e)}attachCompoundItem(e,t){this.rendererObject.use.attachCompoundItem?this.rendererObject.use.attachCompoundItem(e,t,this.superRenderer):this.superRenderer?this.superRenderer.attachCompoundItem(e,t):super.attachCompoundItem(e,t)}}class T extends O{createCompoundContainer(){const e="__lui_compound_"+(new Date).getTime(),t=document.createElement("div");t.classList.add(e);let n="";return this.config.layouts&&this.config.layouts.forEach((t=>{if(t.minWidth||t.maxWidth){let o="@media only screen ";null!=t.minWidth&&(o+=`and (min-width: ${t.minWidth}px) `),null!=t.maxWidth&&(o+=`and (max-width: ${t.maxWidth}px) `),o+=`{\n            .${e} {\n              grid-template-columns: ${t.columns||"auto"};\n              grid-template-rows: ${t.rows||"auto"};\n              grid-gap: ${t.gap||"0"};\n            }\n          }\n          `,n+=o}})),t.innerHTML=`\n        <style scoped>\n          .${e} {\n            display: grid;\n            grid-template-columns: ${this.config.columns||"auto"};\n            grid-template-rows: ${this.config.rows||"auto"};\n            grid-gap: ${this.config.gap||"0"};\n            min-height: ${this.config.minHeight||"auto"};\n          }\n          ${n}\n        </style>\n    `,t}createCompoundItemContainer(e){const t=e||{},n=document.createElement("div");return n.setAttribute("style",`grid-row: ${t.row||"auto"}; grid-column: ${t.column||"auto"}`),n}}const H=e=>{const t=e.use;return t?"grid"===t?new T(e):t.createCompoundContainer||t.createCompoundItemContainer||t.attachCompoundItem?new P(e):new O(e):new O(e)},j=(e,t,n,o)=>{(null==t?void 0:t.eventListeners)&&t.eventListeners.forEach((t=>{const r=t.source+"."+t.name,i=e[r],s={wcElementId:n,wcElement:o,action:t.action,converter:t.dataConverter};i?i.push(s):e[r]=[s]}))};class S{constructor(){this.containerService=new A}dynamicImport(e){return import( /* webpackIgnore: true */e)}processViewUrl(e,t){return e}attachWC(e,t,n,o,r,i){if(n&&n.contains(t)){const s=document.createElement(e);i&&s.setAttribute("nodeId",i),this.initWC(s,e,n,r,o,i),n.replaceChild(s,t)}}createClientAPI(e,t,n){return{linkManager:()=>{},uxManager:()=>({showAlert:e=>{},showConfirmationModal:async e=>new Promise(((e,t)=>{e(!0)}))}),getCurrentLocale:()=>{},publishEvent:e=>{}}}initWC(e,t,n,o,r,i){const s=this.createClientAPI(n,i,t);if(e.__postProcess){const t=new URL(document.baseURI).origin===new URL(o,document.baseURI).origin?new URL("./",new URL(o,document.baseURI)):new URL("./",o);e.__postProcess(r,s,t.origin+t.pathname)}else e.context=r,e.LuigiClient=s}generateWCId(e){let t="";for(let n=0;n<e.length;n++)t+=e.charCodeAt(n).toString(16);return"luigi-wc-"+t}registerWCFromUrl(e,t){const n=this.processViewUrl(e);return new Promise(((e,o)=>{this.checkWCUrl(n)?this.dynamicImport(n).then((n=>{try{if(!window.customElements.get(t)){let e=n.default;if(!HTMLElement.isPrototypeOf(e)){let t=Object.keys(n);for(let o=0;o<t.length&&(e=n[t[o]],!HTMLElement.isPrototypeOf(e));o++);}window.customElements.define(t,e)}e(1)}catch(e){o(e)}})).catch((e=>o(e))):(console.warn(`View URL '${n}' not allowed to be included`),o(`View URL '${n}' not allowed`))}))}includeSelfRegisteredWCFromUrl(e,t,n){if(this.checkWCUrl(t)){this.containerService.getContainerManager()._registerWebcomponent||(this.containerService.getContainerManager()._registerWebcomponent=(e,t)=>{window.customElements.define(this.generateWCId(e),t)});let o=document.createElement("script");o.setAttribute("src",t),"module"===e.webcomponent.type&&o.setAttribute("type","module"),o.setAttribute("defer","true"),o.addEventListener("load",(()=>{n()})),document.body.appendChild(o)}else console.warn(`View URL '${t}' not allowed to be included`)}checkWCUrl(e){return!0}renderWebComponent(e,t,n,o,r){const i=this.processViewUrl(e,{context:n}),s=o.webcomponent&&o.webcomponent.tagName?o.webcomponent.tagName:this.generateWCId(i),c=document.createElement("div");t.appendChild(c),t._luigi_node=o,window.customElements.get(s)?this.attachWC(s,c,t,n,i,r):window.luigiWCFn?window.luigiWCFn(i,s,c,(()=>{this.attachWC(s,c,t,n,i,r)})):o.webcomponent&&o.webcomponent.selfRegistered?this.includeSelfRegisteredWCFromUrl(o,i,(()=>{this.attachWC(s,c,t,n,i,r)})):this.registerWCFromUrl(i,s).then((()=>{this.attachWC(s,c,t,n,i,r)}))}createCompoundContainerAsync(e,t){return new Promise(((n,o)=>{if(e.viewUrl)try{const o=this.generateWCId(e.viewUrl);this.registerWCFromUrl(e.viewUrl,o).then((()=>{const r=document.createElement(o);this.initWC(r,o,r,e.viewUrl,t,"_root"),n(r)}))}catch(e){o(e)}else n(e.createCompoundContainer())}))}renderWebComponentCompound(e,t,n){var o;let r;return e.webcomponent&&e.viewUrl?(r=new O,r.viewUrl=this.processViewUrl(e.viewUrl,{context:n}),r.createCompoundItemContainer=e=>{var t=document.createElement("div");return e&&e.slot&&t.setAttribute("slot",e.slot),t}):(null===(o=e.compound)||void 0===o?void 0:o.renderer)&&(r=H(e.compound.renderer)),r=r||new O,new Promise((o=>{this.createCompoundContainerAsync(r,n).then((i=>{var s;const c={};i.eventBus={listeners:c,onPublishEvent:(e,t,n)=>{const o=c[t+"."+e.type]||[];o.push(...c["*."+e.type]||[]),o.forEach((t=>{const n=t.wcElement||i.querySelector("[nodeId="+t.wcElementId+"]");n?n.dispatchEvent(new CustomEvent(t.action,{detail:t.converter?t.converter(e.detail):e.detail})):console.debug("Could not find event target",t)}))}},null===(s=e.compound)||void 0===s||s.children.forEach(((e,t)=>{const o=Object.assign(Object.assign({},n),e.context),s=r.createCompoundItemContainer(e.layoutConfig);s.eventBus=i.eventBus,r.attachCompoundItem(i,s);const a=e.id||"gen_"+t;this.renderWebComponent(e.viewUrl,s,o,e,a),j(c,e,a)})),t.appendChild(i),j(c,e.compound,"_root",i),o(i)}))}))}}function q(e){let t,n=!e[5](),o=n&&function(e){let t,n;return{c(){t=d("iframe"),a(t.src,n=e[0])||h(t,"src",n),h(t,"title",e[1])},m(n,o){u(n,t,o),e[8](t)},p(e,o){1&o&&!a(t.src,n=e[0])&&h(t,"src",n),2&o&&h(t,"title",e[1])},d(n){n&&l(t),e[8](null)}}}(e);return{c(){o&&o.c(),t=m()},m(e,n){o&&o.m(e,n),u(e,t,n)},p(e,t){n&&o.p(e,t)},d(e){o&&o.d(e),e&&l(t)}}}function F(t){let n,o=!t[4]&&q(t);return{c(){n=d("main"),o&&o.c(),this.c=e,h(n,"class",t[5]()?void 0:"lui-isolated")},m(e,r){u(e,n,r),o&&o.m(n,null),t[9](n)},p(e,[t]){e[4]?o&&(o.d(1),o=null):o?o.p(e,t):(o=q(e),o.c(),o.m(n,null))},i:e,o:e,d(e){e&&l(n),o&&o.d(),t[9](null)}}}function V(e,t,n){let o,{viewurl:r}=t,{context:i}=t,{label:s}=t,{webcomponent:c}=t,a={};const u=new A,l=new S;l.createClientAPI=(e,t,n)=>({linkManager:()=>({navigate:e=>{h("navigation-request",{link:e})}}),uxManager:()=>({showAlert:e=>{h("alert-request",e)},showConfirmationModal:async e=>new Promise(((t,n)=>{h("confirmation-request",e,(e=>{e?t(e):n()}))}))}),getCurrentLocale:()=>{},publishEvent:e=>{}});const d=f();d.iframeHandle=a;let m=!!d.attributes["defer-init"];function h(e,t,n){u.dispatch(e,d,t,n)}function p(){return!!c}var g;return d.init=()=>{n(4,m=!1)},u.registerContainer(d),C((async()=>{const e=i?JSON.parse(i):void 0;p()&&(n(3,o.innerHTML="",o),l.renderWebComponent(r,o,e,{}))})),g=async()=>{},f().$$.on_destroy.push(g),e.$$set=e=>{"viewurl"in e&&n(0,r=e.viewurl),"context"in e&&n(6,i=e.context),"label"in e&&n(1,s=e.label),"webcomponent"in e&&n(7,c=e.webcomponent)},[r,s,a,o,m,p,i,c,function(e){b[e?"unshift":"push"]((()=>{a.iframe=e,n(2,a)}))},function(e){b[e?"unshift":"push"]((()=>{o=e,n(3,o)}))}]}class N extends M{constructor(e){super(),this.shadowRoot.innerHTML="<style>main,iframe{width:100%;height:100%;border:none}main.lui-isolated{line-height:0}</style>",k(this,{target:this.shadowRoot,props:p(this.attributes),customElement:!0},V,F,i,{viewurl:0,context:6,label:1,webcomponent:7},null),e&&(e.target&&u(e.target,this,e.anchor),e.props&&(this.$set(e.props),I()))}static get observedAttributes(){return["viewurl","context","label","webcomponent"]}get viewurl(){return this.$$.ctx[0]}set viewurl(e){this.$$set({viewurl:e}),I()}get context(){return this.$$.ctx[6]}set context(e){this.$$set({context:e}),I()}get label(){return this.$$.ctx[1]}set label(e){this.$$set({label:e}),I()}get webcomponent(){return this.$$.ctx[7]}set webcomponent(e){this.$$set({webcomponent:e}),I()}}function B(t){let n;return{c(){n=d("main"),this.c=e},m(e,o){u(e,n,o),t[2](n)},p:e,i:e,o:e,d(e){e&&l(n),t[2](null)}}}function J(e,t,n){let o,{context:r}=t,i=!1;const s=new A,c=new S;c.createClientAPI=(e,t,n)=>({linkManager:()=>{},uxManager:()=>({showAlert:e=>{u("alert-request",e,{})},showConfirmationModal:async e=>new Promise(((t,n)=>{u("confirmation-request",e,(e=>{e?t(e):n()}))}))}),getCurrentLocale:()=>{},publishEvent:o=>{e&&e.eventBus&&e.eventBus.onPublishEvent(o,t,n)}});const a=f();function u(e,t,n){s.dispatch(e,a,t,n)}return a.attributes["defer-init"],a.init=()=>{if(!a.compoundConfig||i)return;const e={compound:a.compoundConfig};c.renderWebComponentCompound(e,o,r).then((e=>{})),i=!0},s.registerContainer(a),C((async()=>{r&&JSON.parse(r)})),e.$$set=e=>{"context"in e&&n(1,r=e.context)},[o,r,function(e){b[e?"unshift":"push"]((()=>{o=e,n(0,o)}))}]}class z extends M{constructor(e){super(),this.shadowRoot.innerHTML="<style>main{width:100%;height:100%;border:none}</style>",k(this,{target:this.shadowRoot,props:p(this.attributes),customElement:!0},J,B,i,{context:1},null),e&&(e.target&&u(e.target,this,e.anchor),e.props&&(this.$set(e.props),I()))}static get observedAttributes(){return["context"]}get context(){return this.$$.ctx[1]}set context(e){this.$$set({context:e}),I()}}customElements.get("luigi-container")||customElements.define("luigi-container",N),customElements.get("luigi-compound-container")||customElements.define("luigi-compound-container",z);export{z as LuigiCompoundContainer,N as LuigiContainer};
 //# sourceMappingURL=bundle.js.map

package.json

@@ -22,3 +22,3 @@ {
     ],
-    "version": "0.0.9"
+    "version": "0.9.1"
 }

README.md

 
-# Luigi Container (Experimental!)
+# Luigi Container 
 
-# Introduction
-Luigi Container is a component (web component) that can be included in an arbitrary application rendering a luigi micro frontend (iframe or web component based) without the need of being a luigi core application.
+## Overview
+Luigi Container is a [web component](https://developer.mozilla.org/en-US/docs/Web/Web_Components) that can be included in an arbitrary application, in order to render a Luigi micro frontend (iframe or web component based) without the need of being a Luigi Core application.
 
-# Usage
+## Usage
 1. Install the container package: `@luigi-project/container` 
@@ -18,15 +18,20 @@
 ```
-    import { LuigiContainer } from '@luigi-project/container';
+import '@luigi-project/container';
 ```
 
-3. Define your own component with a given tag name that you can use in your applicatoin:
+3. You can now use the Luigi container as follows anywhere in your application:
 
 ```
-customElements.define('my-luigi-container', LuigiContainer);
+    <luigi-container 
+        viewURL="https://www.example-microfronted.com" 
+        webcomponent="false" 
+        label="my label"
+        context='{"label": "Calendar"}'>
+    </luigi-container>
 ```
 
-Having defined the tag you can now use the Luigi container as follows anywhere in your application:
+4. In a similar way you can use the Luigi compound container as follows:
 
 ```
-    <my-luigi-container 
+    <luigi-compound-container 
         viewURL="https://www.example-microfronted.com" 
@@ -36,9 +41,9 @@ webcomponent="false"
         context='{"label": "Calendar"}'>
-    </my-luigi-container>
+    </luigi-compound-container>
 ```
 
 
+## Development 
 
-# Development 
-### Build the bundle and start an example app
+Build the bundle and start an example app: 
 
@@ -51,2 +56,2 @@ ```bash
 
-Check [./public/index.html] for how it is used.
+Check `./test-app/index.html` for how it is used.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

114409

increased by0.89%

Lines of code

70

increased by1.45%

Number of lines in readme file

54

increased by10.2%

No dependency changes