@spfx-extensions/package 1.4.17 → 1.4.19

package/dist/{debug/ClientSideAssets/spfx-extension-loader_0f561cec7fb720b81f80.js → spfx-extension-loader_a0d23da51f784ed5bf85.js}

@@ -1,3 +1,3 @@
-"use strict";(self.webpackJsonp_43cd3dc2da6e43f1c2ca7ead756b0c9a=self.webpackJsonp_43cd3dc2da6e43f1c2ca7ead756b0c9a||[]).push([[548],{364:(e,t,n)=>{n.d(t,{initCore:()=>p});var a=n(367),{getPrototypeOf:i,defineProperty:r,getOwnPropertyNames:o}=(Object.create,Object);Object.prototype.hasOwnProperty;const s=n.p+"spfx-extension-core.js?v=6f41a20fbc0f7e540a52",c=n.p+"spfx-extension-coreconfigurator.js?v=3d2ea4a0277248f51547",d=n.p+"spfx-extension-wrapper.js?v=eac83830b8c1e249f52c";let l,u=!1;async function f(){return Promise.resolve({coreUrl:s,configuratorUrl:c,wrapperUrl:d})}async function p(e,t,n){if(!l){const t="2025-05-15T09:48:48.441Z";console.info(a.Lf,"Initializing Core from SPFx Built:",t),l=async function(e,t){if(window.__SPFxExtensions?.__CorePromise)return window.__SPFxExtensions.__CorePromise;!function(e){if(!window.__SPFxExtensions){let{promise:e,resolve:t}=Promise.withResolvers();window.__SPFxExtensions={__CorePromise:e,__CorePromiseResolver:t}}if(!window.__SPFxExtensions.Utils){let{promise:t,resolve:n}=Promise.withResolvers(),{promise:a,resolve:i}=Promise.withResolvers();window.__SPFxExtensions.Utils={environmentType:e,initializedThroughSPFX:true,placeHolderProviderPromise:t,placeHolderResolver:n,appManifestPromises:[],spAppInitializationPromise:a,spAppInitializationPromiseResolver:i,fluentIconsInitialized:!1,ConfiguratorPageUrl:"/sites/appcatalog/SPFxExtensionsData/SitePages/SPFxExtensionsConfigurator.aspx"}}}(t);let n=await async function(e){let t=Number(localStorage.getItem("SPFXEXT")),n={core:"",configuratorUrl:""};if(t>0){let e=Date.now();return n.core=`https://localhost:${t}/__spfxCore.js?v=${e}`,n.configuratorUrl=`https://localhost:${t}/__spfxCoreConfigurator.js?v=${e}`,n}let{coreUrl:a,configuratorUrl:i}=await e();if(!a)throw new Error("[SPFxExtensions/Core] Unable to resolve SPFx Core location");if(!i)throw new Error("[SPFxExtensions/Core] Unable to resolve SPFx Core Configurator location");return n.core=a,n.configuratorUrl=i,console.info("[SPFxExtensions/Core]","Core location resolved to",n),n}(e);window.__SPFxExtensions.__ConfiguratorUrl=n.configuratorUrl;let a=document.createElement("script");return a.src=n.core,a.type="module",a.addEventListener("error",e=>{console.error("[SPFxExtensions/Core]","Catastrophic failure, cannot load SPFxExtensions Core from",n,e)}),document.head.appendChild(a),window.__SPFxExtensions.__CorePromise}(f,e)}await l,window.__SPFxExtensions.Utils&&!window.__SPFxExtensions.Utils.initializedThroughSPFX&&(window.__SPFxExtensions.Utils.environmentType=e,window.__SPFxExtensions.Utils.initializedThroughSPFX=!0),!u&&t&&n&&(u=!0,window.__SPFxExtensions.Utils.placeHolderResolver({placeHolderProvider:t,eventObserver:n}))}}
+"use strict";(self.webpackJsonp_e31a1d92f125a0954f9e387f020be349=self.webpackJsonp_e31a1d92f125a0954f9e387f020be349||[]).push([[548],{364:(e,t,n)=>{n.d(t,{initCore:()=>p});var a=n(367),{getPrototypeOf:i,defineProperty:r,getOwnPropertyNames:o}=(Object.create,Object);Object.prototype.hasOwnProperty;const s=n.p+"spfx-extension-core.js?v=1a96297cb30b1accf594",c=n.p+"spfx-extension-coreconfigurator.js?v=85da447f23aef5e92916",d=n.p+"spfx-extension-wrapper.js?v=eac83830b8c1e249f52c";let l,u=!1;async function f(){return Promise.resolve({coreUrl:s,configuratorUrl:c,wrapperUrl:d})}async function p(e,t,n){if(!l){const t="2025-05-16T13:46:00.311Z";console.info(a.Lf,"Initializing Core from SPFx Built:",t),l=async function(e,t){if(window.__SPFxExtensions?.__CorePromise)return window.__SPFxExtensions.__CorePromise;!function(e){if(!window.__SPFxExtensions){let{promise:e,resolve:t}=Promise.withResolvers();window.__SPFxExtensions={__CorePromise:e,__CorePromiseResolver:t}}if(!window.__SPFxExtensions.Utils){let{promise:t,resolve:n}=Promise.withResolvers(),{promise:a,resolve:i}=Promise.withResolvers();window.__SPFxExtensions.Utils={environmentType:e,initializedThroughSPFX:true,placeHolderProviderPromise:t,placeHolderResolver:n,appManifestPromises:[],spAppInitializationPromise:a,spAppInitializationPromiseResolver:i,fluentIconsInitialized:!1,ConfiguratorPageUrl:"/sites/appcatalog/SPFxExtensionsData/SitePages/SPFxExtensionsConfigurator.aspx"}}}(t);let n=await async function(e){let t=Number(localStorage.getItem("SPFXEXT")),n={core:"",configuratorUrl:""};if(t>0){let e=Date.now();return n.core=`https://localhost:${t}/__spfxCore.js?v=${e}`,n.configuratorUrl=`https://localhost:${t}/__spfxCoreConfigurator.js?v=${e}`,n}let{coreUrl:a,configuratorUrl:i}=await e();if(!a)throw new Error("[SPFxExtensions/Core] Unable to resolve SPFx Core location");if(!i)throw new Error("[SPFxExtensions/Core] Unable to resolve SPFx Core Configurator location");return n.core=a,n.configuratorUrl=i,console.info("[SPFxExtensions/Core]","Core location resolved to",n),n}(e);window.__SPFxExtensions.__ConfiguratorUrl=n.configuratorUrl;let a=document.createElement("script");return a.src=n.core,a.type="module",a.addEventListener("error",e=>{console.error("[SPFxExtensions/Core]","Catastrophic failure, cannot load SPFxExtensions Core from",n,e)}),document.head.appendChild(a),window.__SPFxExtensions.__CorePromise}(f,e)}await l,window.__SPFxExtensions.Utils&&!window.__SPFxExtensions.Utils.initializedThroughSPFX&&(window.__SPFxExtensions.Utils.environmentType=e,window.__SPFxExtensions.Utils.initializedThroughSPFX=!0),!u&&t&&n&&(u=!0,window.__SPFxExtensions.Utils.placeHolderResolver({placeHolderProvider:t,eventObserver:n}))}}
 ,367:(e,t,n)=>{n.d(t,{Bc:()=>r,Lf:()=>o,Ne:()=>a,oz:()=>i});const a="Select one of these web parts for this column.",i="Edit page and select webpart.",r="Webpart that loads an app of your choice.",o="[SPFxExtensions]"}
 }]);

package/dist/{debug/ClientSideAssets/spfx-extensionloader-web-part_28c32d069e6020bb0978.js → spfx-extensionloader-web-part_0fd44bac09f301704429.js}

@@ -1,3 +1,3 @@
 (()=>{var e=document.currentScript;define(["@microsoft/sp-core-library","@microsoft/sp-property-pane","@microsoft/sp-webpart-base"],(t,n,a)=>(()=>{"use strict";var i,r,o,s={367:(e,t,n)=>{n.d(t,{Bc:()=>r,Lf:()=>o,Ne:()=>a,oz:()=>i});const a="Select one of these web parts for this column.",i="Edit page and select webpart.",r="Webpart that loads an app of your choice.",o="[SPFxExtensions]"}
 ,574:(e,t,n)=>{n.r(t),n.d(t,{default:()=>b});var a,i,r=function(){return r=Object.assign||function(e){for(var t,n=1,a=arguments.length;n<a;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},r.apply(this,arguments)};!function(e){e[e.sync=0]="sync",e[e.async=1]="async"}(a||(a={})),function(e){e[e.onlyThemable=1]="onlyThemable",e[e.onlyNonThemable=2]="onlyNonThemable",e[e.all=3]="all"}(i||(i={}));var o,s,c,d="undefined"==typeof window?n.g:window,l=d&&d.CSPSettings&&d.CSPSettings.nonce,u=((c=d.__themeState__||{theme:void 0,lastStyleElement:void 0,registeredStyles:[]}).runState||(c=r(r({},c),{perf:{count:0,duration:0},runState:{flushTimer:0,mode:a.sync,buffer:[]}})),c.registeredThemableStyles||(c=r(r({},c),{registeredThemableStyles:[]})),d.__themeState__=c,c),f=/[\'\"]\[theme:\s*(\w+)\s*(?:\,\s*default:\s*([\\"\']?[\.\,\(\)\#\-\s\w]*[\.\,\(\)\#\-\w][\"\']?))?\s*\][\'\"]/g,p=function(){return"undefined"!=typeof performance&&performance.now?performance.now():Date.now()};function m(e){var t=p();e();var n=p();u.perf.duration+=n-t}function _(e,t){u.loadStyles?u.loadStyles(h(e).styleString,e):function(e){if("undefined"!=typeof document){var t=document.getElementsByTagName("head")[0],n=document.createElement("style"),a=h(e),i=a.styleString,r=a.themable;n.setAttribute("data-load-themed-styles","true"),l&&n.setAttribute("nonce",l),n.appendChild(document.createTextNode(i)),u.perf.count++,t.appendChild(n);var o=document.createEvent("HTMLEvents");o.initEvent("styleinsert",!0,!1),o.args={newStyle:n},document.dispatchEvent(o);var s={styleElement:n,themableStyle:e};r?u.registeredThemableStyles.push(s):u.registeredStyles.push(s)}}(e)}function h(e){var t=u.theme,n=!1;return{styleString:(e||[]).map(function(e){var a=e.theme;if(a){n=!0;var i=t?t[a]:void 0,r=e.defaultValue||"inherit";return t&&!i&&console,i||r}return e.rawString}).join(""),themable:n}}o='.spfxExtensionloader_be4e0fd1{color:"[theme:bodyText, default: #323130]";color:var(--bodyText);overflow:hidden;padding:1em}.spfxExtensionloader_be4e0fd1.teams_be4e0fd1{font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}.welcome_be4e0fd1{text-align:center}.welcomeImage_be4e0fd1{max-width:420px;width:100%}.links_be4e0fd1 a{color:"[theme:link, default:#03787c]";color:var(--link);text-decoration:none}.links_be4e0fd1 a:hover{color:"[theme:linkHovered, default: #014446]";color:var(--linkHovered);text-decoration:underline}.SPFxExtensionApp_be4e0fd1 .loader_be4e0fd1{animation:rotation_be4e0fd1 1s linear infinite;border:2px solid #003755;border-bottom-color:#009fda;border-radius:50%;box-sizing:border-box;display:inline-block;height:28px;width:28px}@keyframes rotation_be4e0fd1{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.SPFxExtensionApp_be4e0fd1 .buttonLoader_be4e0fd1{align-items:center;border:none;display:flex;height:80px;justify-content:center;width:120px}.SPFxExtensionApp_be4e0fd1 .shimmerShine_be4e0fd1{-webkit-animation-duration:1s;-webkit-animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;-webkit-animation-name:placeholderShimmer_be4e0fd1;-webkit-animation-timing-function:linear;background:#f6f7f8;background-image:linear-gradient(90deg,#f6f7f8 0,#edeef1 20%,#f6f7f8 40%,#f6f7f8);background-repeat:no-repeat;background-size:200px 80px;border:none;display:block;height:80px;position:relative;width:120px}@keyframes placeholderShimmer_be4e0fd1{0%{background-position:-80px 0}to{background-position:120px 0}}.SPFxExtensionApp_be4e0fd1 .applicationListSection_be4e0fd1{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:center;min-height:320px;text-align:center}.SPFxExtensionApp_be4e0fd1 .header_be4e0fd1{color:#242424;font-weight:600;letter-spacing:1px;line-height:32px;padding:0 12px}.SPFxExtensionApp_be4e0fd1 .icon_be4e0fd1{font-size:28px;font-style:normal;height:28px;line-height:28px;min-width:28px;width:28px}.SPFxExtensionApp_be4e0fd1 .icon_be4e0fd1>img,.SPFxExtensionApp_be4e0fd1 .icon_be4e0fd1>svg{height:auto;width:100%}.SPFxExtensionApp_be4e0fd1 .iconFont_be4e0fd1{background-color:#f6f7f8}.SPFxExtensionApp_be4e0fd1 .appButtonsContainer_be4e0fd1{align-items:center;display:flex;flex-wrap:wrap;height:100%;justify-content:center}.SPFxExtensionApp_be4e0fd1 .appButtonsWrapper_be4e0fd1{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;height:100%;justify-content:flex-start;width:100%}.SPFxExtensionApp_be4e0fd1 .appButton_be4e0fd1{align-items:center;background-color:unset;border:none;display:flex;flex-direction:column;height:80px;padding-top:14px;width:120px}.SPFxExtensionApp_be4e0fd1 .appButton_be4e0fd1:hover{background-color:#c8e3fa}',void 0===(s=!0)&&(s=!1),m(function(){var e=Array.isArray(o)?o:function(e){var t=[];if(e){for(var n=0,a=void 0;a=f.exec(e);){var i=a.index;i>n&&t.push({rawString:e.substring(n,i)}),t.push({theme:a[1],defaultValue:a[2]}),n=f.lastIndex}t.push({rawString:e.substring(n)})}return t}(o),t=u.runState,n=t.mode,i=t.buffer,r=t.flushTimer;s||n===a.async?(i.push(e),r||(u.runState.flushTimer=self.setTimeout(function(){u.runState.flushTimer=0,m(function(){var e=u.runState.buffer.slice();u.runState.buffer=[];var t=[].concat.apply([],e);t.length>0&&_(t)})},0))):_(e)});const b={spfxExtensionloader_be4e0fd1:"spfxExtensionloader_be4e0fd1",teams_be4e0fd1:"teams_be4e0fd1",welcome_be4e0fd1:"welcome_be4e0fd1",welcomeImage_be4e0fd1:"welcomeImage_be4e0fd1",links_be4e0fd1:"links_be4e0fd1",SPFxExtensionApp_be4e0fd1:"SPFxExtensionApp_be4e0fd1",loader_be4e0fd1:"loader_be4e0fd1",rotation_be4e0fd1:"rotation_be4e0fd1",buttonLoader_be4e0fd1:"buttonLoader_be4e0fd1",shimmerShine_be4e0fd1:"shimmerShine_be4e0fd1",placeholderShimmer_be4e0fd1:"placeholderShimmer_be4e0fd1",applicationListSection_be4e0fd1:"applicationListSection_be4e0fd1",header_be4e0fd1:"header_be4e0fd1",icon_be4e0fd1:"icon_be4e0fd1",iconFont_be4e0fd1:"iconFont_be4e0fd1",appButtonsContainer_be4e0fd1:"appButtonsContainer_be4e0fd1",appButtonsWrapper_be4e0fd1:"appButtonsWrapper_be4e0fd1",appButton_be4e0fd1:"appButton_be4e0fd1"}}
-,676:e=>{e.exports=t},877:e=>{e.exports=n},642:e=>{e.exports=a}},c={};function d(e){var t=c[e];if(void 0!==t)return t.exports;var n=c[e]={exports:{}};return s[e](n,n.exports,d),n.exports}d.m=s,d.d=(e,t)=>{for(var n in t)d.o(t,n)&&!d.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},d.f={},d.e=e=>Promise.all(Object.keys(d.f).reduce((t,n)=>(d.f[n](e,t),t),[])),d.u=e=>"spfx-extension-loader_0f561cec7fb720b81f80.js",d.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),d.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i={},r="43cd3dc2da6e43f1c2ca7ead756b0c9a:",d.l=(e,t,n,a)=>{if(i[e])i[e].push(t);else{var o,s;if(void 0!==n)for(var c=document.getElementsByTagName("script"),l=0;l<c.length;l++){var u=c[l];if(u.getAttribute("src")==e||u.getAttribute("data-webpack")==r+n){o=u;break}}o||(s=!0,(o=document.createElement("script")).charset="utf-8",o.timeout=120,d.nc&&o.setAttribute("nonce",d.nc),o.setAttribute("data-webpack",r+n),o.src=e,0!==o.src.indexOf(window.location.origin+"/")&&(o.crossOrigin="anonymous")),i[e]=[t];var f=(t,n)=>{o.onerror=o.onload=null,clearTimeout(p);var a=i[e];if(delete i[e],o.parentNode&&o.parentNode.removeChild(o),a&&a.forEach(e=>e(n)),t)return t(n)},p=setTimeout(f.bind(null,void 0,{type:"timeout",target:o}),12e4);o.onerror=f.bind(null,o.onerror),o.onload=f.bind(null,o.onload),s&&document.head.appendChild(o)}},d.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o=e?e.src:"",d.p=o.slice(0,o.lastIndexOf("/")+1),(()=>{var e={650:0};d.f.j=(t,n)=>{var a=d.o(e,t)?e[t]:void 0;if(0!==a)if(a)n.push(a[2]);else{var i=new Promise((n,i)=>a=e[t]=[n,i]);n.push(a[2]=i);var r=d.p+d.u(t),o=new Error;d.l(r,n=>{if(d.o(e,t)&&(0!==(a=e[t])&&(e[t]=void 0),a)){var i=n&&("load"===n.type?"missing":n.type),r=n&&n.target&&n.target.src;o.message="Loading chunk "+t+" failed.\n("+i+": "+r+")",o.name="ChunkLoadError",o.type=i,o.request=r,a[1](o)}},"chunk-"+t,t)}};var t=(t,n)=>{var a,i,[r,o,s]=n,c=0;if(r.some(t=>0!==e[t])){for(a in o)d.o(o,a)&&(d.m[a]=o[a]);s&&s(d)}for(t&&t(n);c<r.length;c++)i=r[c],d.o(e,i)&&e[i]&&e[i][0](),e[i]=0},n=self.webpackJsonp_43cd3dc2da6e43f1c2ca7ead756b0c9a=self.webpackJsonp_43cd3dc2da6e43f1c2ca7ead756b0c9a||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))})();var l={};return(()=>{d.r(l),d.d(l,{default:()=>i});var e=d(676),t=d(877),n=d(642);d(574);var a=d(367);class i extends n.BaseClientSideWebPart{SPFxExtensionInstance;allApps=[];appCatalogUrl="/sites/appcatalog";dropDownProps={options:[],selectedKey:"",disabled:!0};appDescription="";hideAppSelectorWhenAppLoaded=!1;hideConfiguratorButton=!1;configDomElement;emptyRendered=!1;_isDarkTheme=!1;async onInit(){const t=e.Environment.type===e.EnvironmentType.SharePoint?"SharePoint":"ClassicSharePoint",{initCore:n}=await d.e(548).then(d.bind(d,364));await n(t),this.appCatalogUrl=window.__SPFxExtensions.Utils.ConfiguratorPageUrl,this.properties.selectedApp&&!this.SPFxExtensionInstance&&this.mountApp(this.properties.selectedApp).catch(e=>{console.error(a.Lf,"Error while mounting appid",this.properties.selectedApp,e)})}onPropertyPaneConfigurationComplete(){!this.context.propertyPane.isPropertyPaneOpen()&&this.SPFxExtensionInstance&&this.SPFxExtensionInstance.executeListeners("onConfigurationClose",void 0)}onPropertyPaneFieldChanged(e,t,n){if("selectedApp"===e){if(t&&t!==n&&this.SPFxExtensionInstance){if(!confirm("You are about to switch app, this will erase all previous app configuration. Are you sure?"))return void(this.properties[e]=t);this.unmountApp()}n&&(this.webpartSectionElement.remove(),this.mountApp(n).catch(e=>{console.error(a.Lf,"Error while mounting appid",n,e)}))}}onDisplayModeChanged(t){const n=t===e.DisplayMode.Edit?"Read":"Edit";this.SPFxExtensionInstance&&this.SPFxExtensionInstance.executeListeners("onDisplayModeChange",n)}openPropertyPane(){this.context.propertyPane.open()}closePropertyPane(){this.context.propertyPane.close()}isPropertyPaneOpen(){return this.context.propertyPane.isPropertyPaneOpen()}saveConfigValue(e,t=!0){this.properties.SPFxExtensionAppConfiguration=e,t&&this.SPFxExtensionInstance?.executeListeners("onConfigurationChange",e)}getConfigValue(e){return e?this.properties[e]:this.properties.SPFxExtensionAppConfiguration}getSearchData(){return{searchableText:this.properties.searchableText,searchableHtml:this.properties.searchableHtml}}setSearchData(e){this.properties.searchableText=e.searchableText,this.properties.searchableHtml=e.searchableHtml}async mountApp(e){const t={domElement:this.domElement,webpartContext:this.context,openPropertyPane:()=>{this.openPropertyPane()},closePropertyPane:()=>{this.closePropertyPane()},isPropertyPaneOpen:()=>this.isPropertyPaneOpen(),saveConfigValue:(e,t=!0)=>{this.saveConfigValue(e,t)},getConfigValue:e=>this.getConfigValue(e),getSearchableData:()=>this.getSearchData(),setSearchableData:e=>{this.setSearchData(e)}};if(this.SPFxExtensionInstance=await window.__SPFxExtensions.InstantiateApp(e,t),!this.SPFxExtensionInstance)return;const n=window.__SPFxExtensions.Apps.find(t=>t.id===e);n&&(this.appDescription=n.description)}unmountApp(){this.SPFxExtensionInstance&&this.SPFxExtensionInstance.unmount&&this.SPFxExtensionInstance.unmount(),this.SPFxExtensionInstance=void 0,this.properties.SPFxExtensionAppConfiguration=void 0}onDispose(){this.unmountApp()}appButtonElements=[];webpartSectionElement=document.createElement("section");webpartSectionTitle=document.createElement("header");appButtonsWrapper=document.createElement("div");appButtonsContainer=document.createElement("div");generateIconElement(e){const t=document.createElement("i");if(t.classList.add("icon_be4e0fd1"),!e)return t.innerHTML='<svg fill="currentColor" class="___12fm75w f1w7gpdv fez10in fg4l7m0" aria-hidden="true" width="28" height="28" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg"><path d="M20.84 2.66a2.25 2.25 0 0 0-3.18 0L13.5 6.8v-.56c0-1.24-1-2.25-2.25-2.25h-7C3.01 4 2 5.01 2 6.25v18c0 .97.78 1.75 1.75 1.75h18c1.24 0 2.25-1 2.25-2.25v-7c0-1.24-1-2.25-2.25-2.25h-.56l4.16-4.15c.88-.88.88-2.3 0-3.19l-4.5-4.5ZM17.31 14.5H13.5v-3.8l3.8 3.8Zm1.41-10.78c.3-.3.77-.3 1.06 0l4.5 4.5c.3.3.3.77 0 1.06l-4.5 4.51c-.3.3-.77.3-1.06 0l-4.5-4.5a.75.75 0 0 1 0-1.07l4.5-4.5ZM12 6.25v8.25H3.5V6.25c0-.41.34-.75.75-.75h7c.41 0 .75.34.75.75Zm-8.5 17.5V16H12v8.5H4.25a.75.75 0 0 1-.75-.75Zm10-7.75h8.25c.41 0 .75.34.75.75v7c0 .42-.34.75-.75.75H13.5V16Z" fill="currentColor"></path></svg>',t;if("font"===e.iconType&&e.fontFamily&&(t.style.fontFamily=e.fontFamily,t.classList.add("iconFont_be4e0fd1")),"url"===e.iconType){const n=document.createElement("img");n.src=e.iconData,t.appendChild(n)}return"svg"===e.iconType&&(t.innerHTML=e.iconData),t}createAndAppendAppButtons(e){const t=document.createElement("button");t.title=a.Bc,t.ariaLabel=a.Bc,t.className="appButton_be4e0fd1";const n=this.generateIconElement(e.icon);t.append(n,e.name),t.title=e.name,t.addEventListener("click",()=>{this.properties.selectedApp=e.id,this.webpartSectionElement.remove(),this.mountApp(e.id).catch(t=>{console.error(a.Lf,"Error while mounting app",e,t)})}),this.appButtonsContainer.appendChild(t)}createWebpartSection(e){this.webpartSectionElement.className="applicationListSection_be4e0fd1",this.webpartSectionTitle.className="header_be4e0fd1",this.webpartSectionElement.appendChild(this.webpartSectionTitle),e&&this.webpartSectionElement.appendChild(this.appButtonsWrapper)}renderDisplayMode(){this.webpartSectionElement.ariaLabel=a.oz,this.webpartSectionTitle.textContent=a.oz,this.createWebpartSection(),this.domElement.appendChild(this.webpartSectionElement)}renderEditMode(){this.webpartSectionElement.ariaLabel=a.Ne,this.webpartSectionTitle.textContent=a.Ne,this.createWebpartSection(!0),this.appButtonsContainer.className="appButtonsContainer_be4e0fd1",this.appButtonsWrapper.appendChild(this.appButtonsContainer),this.appButtonsWrapper.className="appButtonsWrapper_be4e0fd1",this.domElement.appendChild(this.webpartSectionElement),window.__SPFxExtensions.AddAppEventListener("appAdded",e=>{e.isWebPartApp&&this.createAndAppendAppButtons(e)}),window.__SPFxExtensions.Apps.filter(e=>e.registrationCompleted).forEach(e=>{e.isWebPartApp&&this.createAndAppendAppButtons(e)}),window.__SPFxExtensions.Utils.spAppInitializationPromise.then(()=>{this.domElement.appendChild(this.webpartSectionElement),window.__SPFxExtensions.Utils.appManifestPromises.forEach(e=>{const t=document.createElement("div"),n=document.createElement("span");t.className="buttonLoader_be4e0fd1",n.className="loader_be4e0fd1",t.appendChild(n),this.appButtonsContainer.append(t),e.catch(()=>{}).finally(()=>{t.remove()})})}).catch(()=>{})}render(){this.context.propertyPane.isPropertyPaneOpen()&&this.onPropertyPaneConfigurationStart(),this.properties.selectedApp&&this.SPFxExtensionInstance||(!this.properties.selectedApp||this.SPFxExtensionInstance?(this.domElement.className="SPFxExtensionApp_be4e0fd1",this.displayMode===e.DisplayMode.Read&&this.renderDisplayMode(),this.displayMode===e.DisplayMode.Edit&&this.renderEditMode()):this.mountApp(this.properties.selectedApp).catch(e=>{console.error(a.Lf,"Error while mounting appid",this.properties.selectedApp,e)}))}get propertiesMetadata(){return{searchableText:{isSearchablePlainText:!0},searchableHtml:{isHtmlString:!0}}}onPropertyPaneConfigurationStart(){window.__SPFxExtensions.AllAppAssetsLoadedPromise.then(()=>{const e=window.__SPFxExtensions.Apps.find(e=>e.id===this.properties.selectedApp);e&&(this.appDescription=e.description,this.hideAppSelectorWhenAppLoaded=e.hideAppSelectorWhenAppLoaded??!1,this.hideConfiguratorButton=e.hideConfiguratorButton??!1),this.dropDownProps.options?.splice(0,this.dropDownProps.options?.length);const t=window.__SPFxExtensions.Apps.filter(e=>e.isWebPartApp).map(e=>({key:e.id,text:e.name}));this.dropDownProps.options?.push(...t),this.dropDownProps.selectedKey=this.properties.selectedApp,this.dropDownProps.disabled=!1,this.context.propertyPane.refresh()}).catch(e=>{console.error(a.Lf,"Error while awaiting all app assets to load",e)})}CustomWebpartConfigurationField(e){return{type:t.PropertyPaneFieldType.Custom,targetProperty:e,properties:{key:"SPFxExtensionAppConfiguration",onRender:(e,t,n)=>{this.configDomElement=e,this.SPFxExtensionInstance&&this.SPFxExtensionInstance.instanceLoadPromise.then(()=>{this.SPFxExtensionInstance?.executeListeners("onConfigurationRender",{domElement:e})}).catch(e=>{console.error(a.Lf,"Error while awaiting app to load",e)})},onDispose:(e,t)=>{this.SPFxExtensionInstance&&this.SPFxExtensionInstance.executeListeners("onConfigurationClose",void 0)}}}}getPropertyPaneConfiguration(){const e={groupFields:[(0,t.PropertyPaneLabel)("spfxExtensionLoaderLabel",{text:"App not working? Try refreshing the page. Or go to the configuration page."}),(0,t.PropertyPaneButton)("configuratorButton",{text:"Open Configurator",buttonType:1,onClick:()=>{window.open(`${this.appCatalogUrl}?web=${this.context.pageContext.web.absoluteUrl}`,"_blank")}})]},n=this.hideConfiguratorButton?[]:[e],a={groupFields:[(0,t.PropertyPaneDropdown)("selectedApp",{label:"App",disabled:this.dropDownProps.disabled,options:this.dropDownProps.options,selectedKey:this.dropDownProps.selectedKey}),(0,t.PropertyPaneLabel)("selectedAppDecription",{text:this.appDescription})]};return{pages:[{groups:[...n,...this.hideAppSelectorWhenAppLoaded?[]:[a],{groupFields:[this.CustomWebpartConfigurationField("SPFxExtensionAppConfiguration")]}]}]}}onThemeChanged(e){if(!e)return;this._isDarkTheme=!!e.isInverted;const{semanticColors:t}=e;t&&(this.domElement.style.setProperty("--bodyText",t.bodyText||null),this.domElement.style.setProperty("--link",t.link||null),this.domElement.style.setProperty("--linkHovered",t.linkHovered||null))}get dataVersion(){return e.Version.parse("1.0")}}})(),l})())})();
+,676:e=>{e.exports=t},877:e=>{e.exports=n},642:e=>{e.exports=a}},c={};function d(e){var t=c[e];if(void 0!==t)return t.exports;var n=c[e]={exports:{}};return s[e](n,n.exports,d),n.exports}d.m=s,d.d=(e,t)=>{for(var n in t)d.o(t,n)&&!d.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},d.f={},d.e=e=>Promise.all(Object.keys(d.f).reduce((t,n)=>(d.f[n](e,t),t),[])),d.u=e=>"spfx-extension-loader_a0d23da51f784ed5bf85.js",d.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),d.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i={},r="e31a1d92f125a0954f9e387f020be349:",d.l=(e,t,n,a)=>{if(i[e])i[e].push(t);else{var o,s;if(void 0!==n)for(var c=document.getElementsByTagName("script"),l=0;l<c.length;l++){var u=c[l];if(u.getAttribute("src")==e||u.getAttribute("data-webpack")==r+n){o=u;break}}o||(s=!0,(o=document.createElement("script")).charset="utf-8",o.timeout=120,d.nc&&o.setAttribute("nonce",d.nc),o.setAttribute("data-webpack",r+n),o.src=e,0!==o.src.indexOf(window.location.origin+"/")&&(o.crossOrigin="anonymous")),i[e]=[t];var f=(t,n)=>{o.onerror=o.onload=null,clearTimeout(p);var a=i[e];if(delete i[e],o.parentNode&&o.parentNode.removeChild(o),a&&a.forEach(e=>e(n)),t)return t(n)},p=setTimeout(f.bind(null,void 0,{type:"timeout",target:o}),12e4);o.onerror=f.bind(null,o.onerror),o.onload=f.bind(null,o.onload),s&&document.head.appendChild(o)}},d.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o=e?e.src:"",d.p=o.slice(0,o.lastIndexOf("/")+1),(()=>{var e={650:0};d.f.j=(t,n)=>{var a=d.o(e,t)?e[t]:void 0;if(0!==a)if(a)n.push(a[2]);else{var i=new Promise((n,i)=>a=e[t]=[n,i]);n.push(a[2]=i);var r=d.p+d.u(t),o=new Error;d.l(r,n=>{if(d.o(e,t)&&(0!==(a=e[t])&&(e[t]=void 0),a)){var i=n&&("load"===n.type?"missing":n.type),r=n&&n.target&&n.target.src;o.message="Loading chunk "+t+" failed.\n("+i+": "+r+")",o.name="ChunkLoadError",o.type=i,o.request=r,a[1](o)}},"chunk-"+t,t)}};var t=(t,n)=>{var a,i,[r,o,s]=n,c=0;if(r.some(t=>0!==e[t])){for(a in o)d.o(o,a)&&(d.m[a]=o[a]);s&&s(d)}for(t&&t(n);c<r.length;c++)i=r[c],d.o(e,i)&&e[i]&&e[i][0](),e[i]=0},n=self.webpackJsonp_e31a1d92f125a0954f9e387f020be349=self.webpackJsonp_e31a1d92f125a0954f9e387f020be349||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))})();var l={};return(()=>{d.r(l),d.d(l,{default:()=>i});var e=d(676),t=d(877),n=d(642);d(574);var a=d(367);class i extends n.BaseClientSideWebPart{SPFxExtensionInstance;allApps=[];appCatalogUrl="/sites/appcatalog";dropDownProps={options:[],selectedKey:"",disabled:!0};appDescription="";hideAppSelectorWhenAppLoaded=!1;hideConfiguratorButton=!1;configDomElement;_isDarkTheme=!1;async onInit(){const t=e.Environment.type===e.EnvironmentType.SharePoint?"SharePoint":"ClassicSharePoint",{initCore:n}=await d.e(548).then(d.bind(d,364));await n(t),this.appCatalogUrl=window.__SPFxExtensions.Utils.ConfiguratorPageUrl}onPropertyPaneConfigurationComplete(){!this.context.propertyPane.isPropertyPaneOpen()&&this.SPFxExtensionInstance&&this.SPFxExtensionInstance.executeListeners("onConfigurationClose",void 0)}onPropertyPaneFieldChanged(e,t,n){if("selectedApp"===e){if(t&&t!==n&&this.SPFxExtensionInstance){if(!confirm("You are about to switch app, this will erase all previous app configuration. Are you sure?"))return void(this.properties[e]=t);this.unmountApp()}n&&(this.webpartSectionElement.remove(),this.mountApp(n).catch(()=>{}))}}onDisplayModeChanged(t){const n=t===e.DisplayMode.Edit?"Read":"Edit";this.SPFxExtensionInstance&&this.SPFxExtensionInstance.executeListeners("onDisplayModeChange",n)}openPropertyPane(){this.context.propertyPane.open()}closePropertyPane(){this.context.propertyPane.close()}isPropertyPaneOpen(){return this.context.propertyPane.isPropertyPaneOpen()}saveConfigValue(e,t=!0){this.properties.SPFxExtensionAppConfiguration=e,t&&this.SPFxExtensionInstance?.executeListeners("onConfigurationChange",e)}getConfigValue(e){if(e){let t=this.properties[e];return void 0===t&&(t=this.properties.SPFxExtensionAppConfiguration),t}return this.properties.SPFxExtensionAppConfiguration}getSearchData(){return{searchableText:this.properties.searchableText,searchableHtml:this.properties.searchableHtml}}setSearchData(e){this.properties.searchableText=e.searchableText,this.properties.searchableHtml=e.searchableHtml}async mountApp(e){this.domElement.innerHTML="";try{const t={domElement:this.domElement,webpartContext:this.context,openPropertyPane:()=>{this.openPropertyPane()},closePropertyPane:()=>{this.closePropertyPane()},isPropertyPaneOpen:()=>this.isPropertyPaneOpen(),saveConfigValue:(e,t=!0)=>{this.saveConfigValue(e,t)},getConfigValue:e=>this.getConfigValue(e),getSearchableData:()=>this.getSearchData(),setSearchableData:e=>{this.setSearchData(e)}};if(this.SPFxExtensionInstance=await window.__SPFxExtensions.InstantiateApp(e,t),!this.SPFxExtensionInstance)return;const n=window.__SPFxExtensions.Apps.find(t=>t.id===e);n&&(this.appDescription=n.description),this.renderCompleted(void 0,!0)}catch(t){console.error(a.Lf,"Error while mounting appid",e,t);const n=new Error(`${t}`);this.renderCompleted(n)}}unmountApp(){this.SPFxExtensionInstance&&this.SPFxExtensionInstance.unmount?.(),this.SPFxExtensionInstance=void 0,this.domElement.innerHTML=""}onDispose(){this.unmountApp()}appButtonElements=[];webpartSectionElement=document.createElement("section");webpartSectionTitle=document.createElement("header");appButtonsWrapper=document.createElement("div");appButtonsContainer=document.createElement("div");generateIconElement(e){const t=document.createElement("i");if(t.classList.add("icon_be4e0fd1"),!e)return t.innerHTML='<svg fill="currentColor" class="___12fm75w f1w7gpdv fez10in fg4l7m0" aria-hidden="true" width="28" height="28" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg"><path d="M20.84 2.66a2.25 2.25 0 0 0-3.18 0L13.5 6.8v-.56c0-1.24-1-2.25-2.25-2.25h-7C3.01 4 2 5.01 2 6.25v18c0 .97.78 1.75 1.75 1.75h18c1.24 0 2.25-1 2.25-2.25v-7c0-1.24-1-2.25-2.25-2.25h-.56l4.16-4.15c.88-.88.88-2.3 0-3.19l-4.5-4.5ZM17.31 14.5H13.5v-3.8l3.8 3.8Zm1.41-10.78c.3-.3.77-.3 1.06 0l4.5 4.5c.3.3.3.77 0 1.06l-4.5 4.51c-.3.3-.77.3-1.06 0l-4.5-4.5a.75.75 0 0 1 0-1.07l4.5-4.5ZM12 6.25v8.25H3.5V6.25c0-.41.34-.75.75-.75h7c.41 0 .75.34.75.75Zm-8.5 17.5V16H12v8.5H4.25a.75.75 0 0 1-.75-.75Zm10-7.75h8.25c.41 0 .75.34.75.75v7c0 .42-.34.75-.75.75H13.5V16Z" fill="currentColor"></path></svg>',t;if("font"===e.iconType&&e.fontFamily&&(t.style.fontFamily=e.fontFamily,t.classList.add("iconFont_be4e0fd1")),"url"===e.iconType){const n=document.createElement("img");n.src=e.iconData,t.appendChild(n)}return"svg"===e.iconType&&(t.innerHTML=e.iconData),t}createAndAppendAppButtons(e){const t=document.createElement("button");t.title=a.Bc,t.ariaLabel=a.Bc,t.className="appButton_be4e0fd1";const n=this.generateIconElement(e.icon);t.append(n,e.name),t.title=e.name,t.addEventListener("click",t=>{t.stopPropagation(),t.preventDefault(),this.properties.selectedApp=e.id,this.webpartSectionElement.remove(),this.mountApp(e.id).catch(()=>{})}),this.appButtonsContainer.appendChild(t)}createWebpartSection(e){this.webpartSectionElement.className="applicationListSection_be4e0fd1",this.webpartSectionTitle.className="header_be4e0fd1",this.webpartSectionElement.appendChild(this.webpartSectionTitle),e&&this.webpartSectionElement.appendChild(this.appButtonsWrapper)}renderDisplayMode(){this.webpartSectionElement.ariaLabel=a.oz,this.webpartSectionTitle.textContent=a.oz,this.createWebpartSection(),this.domElement.appendChild(this.webpartSectionElement)}async renderEditMode(){this.webpartSectionElement.ariaLabel=a.Ne,this.webpartSectionTitle.textContent=a.Ne,this.createWebpartSection(!0),this.appButtonsContainer.className="appButtonsContainer_be4e0fd1",this.appButtonsWrapper.appendChild(this.appButtonsContainer),this.appButtonsWrapper.className="appButtonsWrapper_be4e0fd1",this.domElement.appendChild(this.webpartSectionElement),window.__SPFxExtensions.AddAppEventListener("appAdded",e=>{e.isWebPartApp&&this.createAndAppendAppButtons(e)}),window.__SPFxExtensions.Apps.filter(e=>e.registrationCompleted).forEach(e=>{e.isWebPartApp&&this.createAndAppendAppButtons(e)});try{await window.__SPFxExtensions.Utils.spAppInitializationPromise,this.domElement.appendChild(this.webpartSectionElement),window.__SPFxExtensions.Utils.appManifestPromises.forEach(e=>{const t=document.createElement("div"),n=document.createElement("span");t.className="buttonLoader_be4e0fd1",n.className="loader_be4e0fd1",t.appendChild(n),this.appButtonsContainer.append(t),e.catch(()=>{}).finally(()=>{t.remove()})})}catch(e){console.error(a.Lf,"Error while awaiting app initialization",e)}}async render(){this.SPFxExtensionInstance&&(this.SPFxExtensionInstance.unmountOnRender?this.unmountApp():this.SPFxExtensionInstance.executeListeners("onRender",void 0)),!this.properties.selectedApp||this.SPFxExtensionInstance?this.renderedOnce||this.domElement.children.length>0||(this.domElement.className="SPFxExtensionApp_be4e0fd1",this.displayMode===e.DisplayMode.Read?this.renderDisplayMode():await this.renderEditMode(),this.renderCompleted(void 0,!0)):await this.mountApp(this.properties.selectedApp)}renderCompleted(e,t){super.renderCompleted(e,t)}get isRenderAsync(){return!0}get propertiesMetadata(){return{searchableText:{isSearchablePlainText:!0},searchableHtml:{isHtmlString:!0}}}onPropertyPaneConfigurationStart(){window.__SPFxExtensions.AllAppAssetsLoadedPromise.then(()=>{const e=window.__SPFxExtensions.Apps.find(e=>e.id===this.properties.selectedApp);e&&(this.appDescription=e.description,this.hideAppSelectorWhenAppLoaded=e.hideAppSelectorWhenAppLoaded??!1,this.hideConfiguratorButton=e.hideConfiguratorButton??!1),this.dropDownProps.options?.splice(0,this.dropDownProps.options?.length);const t=window.__SPFxExtensions.Apps.filter(e=>e.isWebPartApp).map(e=>({key:e.id,text:e.name}));this.dropDownProps.options?.push(...t),this.dropDownProps.selectedKey=this.properties.selectedApp,this.dropDownProps.disabled=!1,this.context.propertyPane.refresh()}).catch(e=>{console.error(a.Lf,"Error while awaiting all app assets to load",e)})}CustomWebpartConfigurationField(e){return{type:t.PropertyPaneFieldType.Custom,targetProperty:e,properties:{key:"SPFxExtensionAppConfiguration",onRender:(e,t,n)=>{this.configDomElement=e,this.SPFxExtensionInstance&&this.SPFxExtensionInstance.instanceLoadPromise.then(()=>{this.SPFxExtensionInstance?.executeListeners("onConfigurationRender",{domElement:e})}).catch(e=>{console.error(a.Lf,"Error while awaiting app to load",e)})},onDispose:(e,t)=>{this.SPFxExtensionInstance&&this.SPFxExtensionInstance.executeListeners("onConfigurationClose",void 0)}}}}getPropertyPaneConfiguration(){const e={groupFields:[(0,t.PropertyPaneLabel)("spfxExtensionLoaderLabel",{text:"App not working? Try refreshing the page. Or go to the configuration page."}),(0,t.PropertyPaneButton)("configuratorButton",{text:"Open Configurator",buttonType:1,onClick:()=>{window.open(`${this.appCatalogUrl}?web=${this.context.pageContext.web.absoluteUrl}`,"_blank")}})]},n=this.hideConfiguratorButton?[]:[e],a={groupFields:[(0,t.PropertyPaneDropdown)("selectedApp",{label:"App",disabled:this.dropDownProps.disabled,options:this.dropDownProps.options,selectedKey:this.dropDownProps.selectedKey}),(0,t.PropertyPaneLabel)("selectedAppDecription",{text:this.appDescription})]};return{pages:[{groups:[...n,...this.hideAppSelectorWhenAppLoaded?[]:[a],{groupFields:[this.CustomWebpartConfigurationField("SPFxExtensionAppConfiguration")]}]}]}}onThemeChanged(e){if(!e)return;this._isDarkTheme=!!e.isInverted;const{semanticColors:t}=e;t&&(this.domElement.style.setProperty("--bodyText",t.bodyText||null),this.domElement.style.setProperty("--link",t.link||null),this.domElement.style.setProperty("--linkHovered",t.linkHovered||null))}get dataVersion(){return e.Version.parse("1.0")}}})(),l})())})();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spfx-extensions/package",
-  "version": "1.4.17",
+  "version": "1.4.19",
   "author": "SPWizard01",
   "access": "public",
   "repository": {
@@ -15,6 +15,7 @@
   "scripts": {
     "build": "gulp bundle",
     "clean": "gulp clean",
+    "serve": "gulp serve",
     "prerelease": "gulp clean",
     "release": "gulp bundle --ship",
     "postrelease": "gulp package-solution --ship",
@@ -43,7 +44,7 @@
     "@microsoft/sp-office-ui-fabric-core": "^1.21.1",
     "@microsoft/sp-property-pane": "^1.21.1",
     "@microsoft/sp-webpart-base": "^1.21.1",
-    "@spfx-extensions/core": "^0.7.5",
+    "@spfx-extensions/core": "^0.7.7",
     "tslib": "^2.8.1"
   },
   "devDependencies": {

package/src/extensions/spfxExtension/SpfxExtensionApplicationCustomizer.ts

@@ -32,7 +32,7 @@ export default class SpfxExtensionApplicationCustomizer
     // this fires before onInit
     await initCore(
       "SharePoint",
-      this.context.placeholderProvider,
+      placeholderProvider,
       this
     );
     window.__SPFxExtensions.Apps.forEach((app) => {

package/src/webparts/spfxExtensionloader/SpfxExtensionloaderWebPart.ts

@@ -43,11 +43,12 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
   hideAppSelectorWhenAppLoaded = false;
   hideConfiguratorButton = false;
   configDomElement: HTMLElement | undefined;
-
-  emptyRendered = false;
   _isDarkTheme: boolean = false;
 
   public async onInit() {
+    if (DEBUG) {
+      console.debug(SPFXPREFIX, "onInit");
+    }
     const envType =
       Environment.type === EnvironmentType.SharePoint
         ? "SharePoint"
@@ -56,11 +57,6 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
     //init core then do stuff;
     await initCore(envType);
     this.appCatalogUrl = window.__SPFxExtensions.Utils.ConfiguratorPageUrl;
-    if (this.properties.selectedApp && !this.SPFxExtensionInstance) {
-      this.mountApp(this.properties.selectedApp).catch((err) => {
-        console.error(SPFXPREFIX, "Error while mounting appid", this.properties.selectedApp, err);
-      });
-    }
   }
 
   protected onPropertyPaneConfigurationComplete(): void {
@@ -108,8 +104,8 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
       // if new app was selected, mount it
       if (newValue) {
         this.webpartSectionElement.remove();
-        this.mountApp(newValue).catch((err) => {
-          console.error(SPFXPREFIX, "Error while mounting appid", newValue, err);
+        this.mountApp(newValue).catch(() => {
+          // do nothing
         });
       }
     }
@@ -150,7 +146,11 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
 
   getConfigValue(key?: string) {
     if (key) {
-      return (this.properties[key as keyof ISpfxExtensionloaderWebPartProps] as SPFxExtensionAppConfig | undefined);
+      let dataByKey = (this.properties[key as keyof ISpfxExtensionloaderWebPartProps] as SPFxExtensionAppConfig | undefined);
+      if (typeof dataByKey === "undefined") {
+        dataByKey = this.properties.SPFxExtensionAppConfiguration;
+      }
+      return dataByKey;
     }
     return this.properties.SPFxExtensionAppConfiguration;
   }
@@ -171,50 +171,60 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
     if (ISDEBUG) {
       console.debug(SPFXPREFIX, "Mounting app", appId, "at", this.domElement);
     }
-    const runTimeConfig: SPFxExtensionAppRuntimeConfig = {
-      domElement: this.domElement,
-      //eslint-disable-next-line @typescript-eslint/no-explicit-any
-      webpartContext: this.context as any,
-      openPropertyPane: () => {
-        this.openPropertyPane();
-      },
-      closePropertyPane: () => {
-        this.closePropertyPane();
-      },
-      isPropertyPaneOpen: () => {
-        return this.isPropertyPaneOpen();
-      },
-      saveConfigValue: (config: SPFxExtensionAppConfig, raise = true) => {
-        this.saveConfigValue(config, raise);
-      },
-      getConfigValue: (key?: string) => {
-        return this.getConfigValue(key);
-      },
-      getSearchableData: () => {
-        return this.getSearchData();
-      },
-      setSearchableData: (data: SPFxExtensionAppSearchableData) => {
-        this.setSearchData(data);
-      },
-    };
-    this.SPFxExtensionInstance = await window.__SPFxExtensions.InstantiateApp(appId, runTimeConfig);
-    if (!this.SPFxExtensionInstance) {
-      return;
+    //clean HTML
+    this.domElement.innerHTML = "";
+    try {
+      const runTimeConfig: SPFxExtensionAppRuntimeConfig = {
+        domElement: this.domElement,
+        //eslint-disable-next-line @typescript-eslint/no-explicit-any
+        webpartContext: this.context as any,
+        openPropertyPane: () => {
+          this.openPropertyPane();
+        },
+        closePropertyPane: () => {
+          this.closePropertyPane();
+        },
+        isPropertyPaneOpen: () => {
+          return this.isPropertyPaneOpen();
+        },
+        saveConfigValue: (config: SPFxExtensionAppConfig, raise = true) => {
+          this.saveConfigValue(config, raise);
+        },
+        getConfigValue: (key?: string) => {
+          return this.getConfigValue(key);
+        },
+        getSearchableData: () => {
+          return this.getSearchData();
+        },
+        setSearchableData: (data: SPFxExtensionAppSearchableData) => {
+          this.setSearchData(data);
+        },
+      };
+      this.SPFxExtensionInstance = await window.__SPFxExtensions.InstantiateApp(appId, runTimeConfig);
+      if (!this.SPFxExtensionInstance) {
+        return;
+      }
+      const newApp = window.__SPFxExtensions.Apps.find((app) => app.id === appId);
+      if (newApp) {
+        this.appDescription = newApp.description;
+        //spfx specific, for some reason refresh does not work properly (custom field is not rerendered)
+        // this.context.propertyPane.refresh();
+        // if (this.context.propertyPane.isPropertyPaneOpen()) {
+        //   this.context.propertyPane.close();
+        //   this.context.propertyPane.open();
+        // }
+      }
+      this.renderCompleted(undefined, true);
     }
-    const newApp = window.__SPFxExtensions.Apps.find((app) => app.id === appId);
-    if (newApp) {
-      this.appDescription = newApp.description;
-      //spfx specific, for some reason refresh does not work properly (custom field is not rerendered)
-      // this.context.propertyPane.refresh();
-      // if (this.context.propertyPane.isPropertyPaneOpen()) {
-      //   this.context.propertyPane.close();
-      //   this.context.propertyPane.open();
-      // }
+    catch (err) {
+      console.error(SPFXPREFIX, "Error while mounting appid", appId, err);
+      const error = new Error(`${err}`);
+      this.renderCompleted(error);
     }
   }
 
   private unmountApp() {
-    if (this.SPFxExtensionInstance && this.SPFxExtensionInstance.unmount) {
+    if (this.SPFxExtensionInstance) {
       if (ISDEBUG) {
         console.debug(
           SPFXPREFIX,
@@ -224,13 +234,16 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
           this.SPFxExtensionInstance.domElement
         );
       }
-      this.SPFxExtensionInstance.unmount();
+      this.SPFxExtensionInstance.unmount?.();
     }
     this.SPFxExtensionInstance = undefined;
-    this.properties.SPFxExtensionAppConfiguration = undefined;
+    this.domElement.innerHTML = "";
   }
 
   protected onDispose(): void {
+    if (DEBUG) {
+      console.debug(SPFXPREFIX, "onDispose");
+    }
     this.unmountApp();
   }
 
@@ -278,11 +291,13 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
     appButtonElement.append(icon, app.name);
     appButtonElement.title = app.name;
 
-    appButtonElement.addEventListener("click", () => {
+    appButtonElement.addEventListener("click", (ev) => {
+      ev.stopPropagation();
+      ev.preventDefault();
       this.properties.selectedApp = app.id;
       this.webpartSectionElement.remove();
-      this.mountApp(app.id).catch((err) => {
-        console.error(SPFXPREFIX, "Error while mounting app", app, err);
+      this.mountApp(app.id).catch(() => {
+        // do nothing
       });
     });
 
@@ -305,7 +320,7 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
     this.domElement.appendChild(this.webpartSectionElement);
   }
 
-  renderEditMode() {
+  async renderEditMode() {
     this.webpartSectionElement.ariaLabel = SELECT_WEBPART;
     this.webpartSectionTitle.textContent = SELECT_WEBPART;
     this.createWebpartSection(true);
@@ -328,10 +343,9 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
         }
       }
     );
-
-    window.__SPFxExtensions.Utils.spAppInitializationPromise.then(() => {
+    try {
+      await window.__SPFxExtensions.Utils.spAppInitializationPromise;
       this.domElement.appendChild(this.webpartSectionElement);
-
       window.__SPFxExtensions.Utils.appManifestPromises.forEach((promise) => {
         const buttonLoader = document.createElement("div");
         const loaderSpinner = document.createElement("span");
@@ -347,37 +361,64 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
             buttonLoader.remove();
           });
       });
-    }).catch(() => {
-      // do nothing
-    });
+    }
+    catch (err) {
+      console.error(SPFXPREFIX, "Error while awaiting app initialization", err);
+    }
   }
 
-  public render() {
-    // do not uncomment this or this will "erase the webpart when exiting edit mode";
+  public async render() {
+    // might not be required anymore
+    // initial testing shows that it works without this
     // required when adding same Webpart while another instance is already open and configuration pane is open as well.
-    if (this.context.propertyPane.isPropertyPaneOpen()) {
-      this.onPropertyPaneConfigurationStart();
+    // if (this.context.propertyPane.isPropertyPaneOpen()) {
+    //   this.onPropertyPaneConfigurationStart();
+    // }
+    if (DEBUG) {
+      console.debug(SPFXPREFIX, "render");
     }
-    if (this.properties.selectedApp && this.SPFxExtensionInstance) {
-      return;
+
+    //in live editing mode dispose is not called when in production build for some reason
+    //we unmount and remount the app if applicable
+    if (this.SPFxExtensionInstance) {
+      if (this.SPFxExtensionInstance.unmountOnRender) {
+        this.unmountApp();
+      } else {
+        this.SPFxExtensionInstance.executeListeners("onRender", undefined);
+      }
     }
-    if(this.properties.selectedApp && !this.SPFxExtensionInstance) {
-      //might need to be awaited
-      this.mountApp(this.properties.selectedApp).catch((err) => {
-        console.error(SPFXPREFIX, "Error while mounting appid", this.properties.selectedApp, err);
-      });
+
+    if (this.properties.selectedApp && !this.SPFxExtensionInstance) {
+      await this.mountApp(this.properties.selectedApp);
       return;
     }
 
+    if (this.renderedOnce || this.domElement.children.length > 0) {
+      if (DEBUG) {
+        console.debug(SPFXPREFIX, "Already rendered");
+      }
+      return;
+    }
+    if (DEBUG) {
+      console.debug(SPFXPREFIX, "Rendering display or edit mode empty webpart");
+    }
     this.domElement.className = styles.SPFxExtensionApp;
 
     if (this.displayMode === DisplayMode.Read) {
       this.renderDisplayMode();
+    } else {
+      await this.renderEditMode();
     }
 
-    if (this.displayMode === DisplayMode.Edit) {
-      this.renderEditMode();
-    }
+    this.renderCompleted(undefined, true);
+  }
+
+  protected renderCompleted(error?: Error, didUpdate?: boolean): void {
+    super.renderCompleted(error, didUpdate);
+  }
+
+  protected get isRenderAsync() {
+    return true;
   }
 
   protected get propertiesMetadata(): IWebPartPropertiesMetadata {
@@ -398,6 +439,9 @@ export default class SpfxExtensionloaderWebPart extends BaseClientSideWebPart<IS
   }
 
   protected onPropertyPaneConfigurationStart(): void {
+    if (ISDEBUG) {
+      console.debug(SPFXPREFIX, "Property pane configuration start");
+    }
     // wait for all the manifests to load
     window.__SPFxExtensions.AllAppAssetsLoadedPromise.then(() => {
       // register description if an app is matching this webpart