@combeenation/custom-code-sdk 0.0.1-alpha7 → 0.0.1-alpha8

package/dist/bundle.cjs.js

@@ -1 +1 @@
-"use strict";var se=Object.defineProperty;var x=t=>{throw TypeError(t)};var re=(t,n,e)=>n in t?se(t,n,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[n]=e;var d=(t,n,e)=>re(t,typeof n!="symbol"?n+"":n,e),L=(t,n,e)=>n.has(t)||x("Cannot "+e);var o=(t,n,e)=>(L(t,n,"read from private field"),e?e.call(t):n.get(t)),a=(t,n,e)=>n.has(t)?x("Cannot add the same private member more than once"):n instanceof WeakSet?n.add(t):n.set(t,e),c=(t,n,e,i)=>(L(t,n,"write to private field"),i?i.call(t,e):n.set(t,e),e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("zod"),O="0.0.1-alpha7";var z,C;class ae{constructor(n){d(this,"id");a(this,z,"v1");a(this,C);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,z));if(c(this,C,e==null?void 0:e.getButtonSdkBridge(this.id)),!o(this,C))throw new Error(`Cannot access API for Button "${this.id}".`)}onRendered(n){var e;return((e=o(this,C))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}onClick(n){var e;return((e=o(this,C))==null?void 0:e.addOnClickCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=o(this,C))==null?void 0:e.setVisible(n))}setText(n){var e;(e=o(this,C))==null||e.setText(n)}}z=new WeakMap,C=new WeakMap;var B,l;class de{constructor(n){d(this,"id");a(this,B,"v1");a(this,l);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,B));if(c(this,l,e==null?void 0:e.getCheckboxSdkBridge(this.id)),!o(this,l))throw new Error(`Cannot access API for Checkbox "${this.id}".`)}onRendered(n){var e;return((e=o(this,l))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=o(this,l))==null?void 0:e.setVisible(n))}}B=new WeakMap,l=new WeakMap;var E,h;class ce{constructor(n){d(this,"id");a(this,E,"v1");a(this,h);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,E));if(c(this,h,e==null?void 0:e.getCollapsibleSdkBridge(this.id)),!o(this,h))throw new Error(`Cannot access API for Collapsible "${this.id}".`)}onRendered(n){var e;return((e=o(this,h))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=o(this,h))==null?void 0:e.setVisible(n))}}E=new WeakMap,h=new WeakMap;var I,g;class Ce{constructor(n){d(this,"id");a(this,I,"v1");a(this,g);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,I));if(c(this,g,e==null?void 0:e.getCustomCtrlSdkBridge(this.id)),!o(this,g))throw new Error(`Cannot access API for Custom Control "${this.id}".`)}set renderFn(n){var e;(e=o(this,g))==null||e.setRenderFn(n)}async render(n){var e;typeof n=="function"&&(this.renderFn=n),await((e=o(this,g))==null?void 0:e.render())}getElement(){var e;return(e=o(this,g))==null?void 0:e.getElement()}async setVisible(n){var e;await((e=o(this,g))==null?void 0:e.setVisible(n))}}I=new WeakMap,g=new WeakMap;var S,b;class ge{constructor(n){d(this,"id");a(this,S,"v1");a(this,b);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,S));if(c(this,b,e==null?void 0:e.getDataviewSdkBridge(this.id)),!o(this,b))throw new Error(`Cannot access API for Dataview "${this.id}".`)}onRendered(n){var e;return((e=o(this,b))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=o(this,b))==null?void 0:e.setVisible(n))}}S=new WeakMap,b=new WeakMap;var v,p;class ue{constructor(n){d(this,"id");a(this,v,"v1");a(this,p);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,v));if(c(this,p,e==null?void 0:e.getInputSdkBridge(this.id)),!o(this,p))throw new Error(`Cannot access API for Input "${this.id}".`)}onRendered(n){var e;return((e=o(this,p))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=o(this,p))==null?void 0:e.setVisible(n))}}v=new WeakMap,p=new WeakMap;var R,m;class le{constructor(n){d(this,"id");a(this,R,"v1");a(this,m);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,R));if(c(this,m,e==null?void 0:e.getPanelSdkBridge(this.id)),!o(this,m))throw new Error(`Cannot access API for Panel "${this.id}".`)}onRendered(n){var e;return((e=o(this,m))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=o(this,m))==null?void 0:e.setVisible(n))}}R=new WeakMap,m=new WeakMap;var P,u;class he{constructor(n){d(this,"id");a(this,P,"v1");a(this,u);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,o(this,P));if(c(this,u,e==null?void 0:e.getTextSdkBridge(this.id)),!o(this,u))throw new Error(`Cannot access API for Text "${this.id}".`)}onRendered(n){var e;return((e=o(this,u))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=o(this,u))==null?void 0:e.setVisible(n))}setText(n){var e;(e=o(this,u))==null||e.setText(n)}}P=new WeakMap,u=new WeakMap;const U=1,y=[];function be(t,n){if(y.length>=U)throw new Error(`Only ${U} \`ConfiguratorClient\` can be created at a time.`);y.push({client:t,internals:n})}function D(){const t=y[0];if(!t)throw new Error("Operation not possible as no `ConfiguratorClient` has been registered yet.");return t.client}function pe(){const t=y[0];if(!t)throw new Error("Operation not possible as no `ConfiguratorClient` has been registered yet.");return t.internals}const me="v1";var A,Z;const F=(Z=(A=window.Cbn)==null?void 0:A.getCustomCodeSdkBridge)==null?void 0:Z.call(A,"v1");if(!F)throw new Error("Cannot access Configurator SDK bridge. Make sure to only use the `custom-code-sdk` inside a Combeenation Configurator.");const N=F.createCfgrClient(me,be);if(!N)throw new Error("Cannot create Configurator Client. Make sure to only use the `custom-code-sdk` inside a Combeenation Configurator.");const w=F.getParentPageUtilsSdkBridge(),j=F.getCfgrUtilsSdkBridge(),T=N,$={Text:"Text",Number:"Number",Logic:"Logic"},f={ValueComponent:"ValueComponent",TableComponent:"TableComponent",RecordComponent:"RecordComponent",ResourceComponent:"ResourceComponent",GraphicComponent:"GraphicComponent",CheckoutComponent:"CheckoutComponent"},k={ValueEditor:"ValueEditor",TableEditor:"TableEditor",Fiber:"Fiber",FiberEditor:"FiberEditor",CfgrField:"CfgrField"};s.z.enum([k.ValueEditor,k.TableEditor,k.Fiber,k.FiberEditor,k.CfgrField]);s.z.union([s.z.string(),s.z.number(),s.z.boolean()]);const V=t=>typeof t=="string";s.z.string();s.z.enum([$.Text,$.Number,$.Logic]);s.z.string();s.z.custom(t=>V(t)&&t.toLowerCase()===t);const G=t=>(t==null?void 0:t.toLowerCase())??"";s.z.string();const we=s.z.custom(t=>V(t)?new RegExp(`^${f.ValueComponent}<.*>$`).test(t):!1),fe=s.z.custom(t=>V(t)?new RegExp(`^${f.RecordComponent}<.*>$`).test(t):!1),ke=s.z.custom(t=>V(t)?new RegExp(`^${f.ResourceComponent}<.*>$`).test(t):!1),Ve=s.z.custom(t=>V(t)?new RegExp(`^${f.TableComponent}<.*>$`).test(t):!1);s.z.union([we,Ve,fe,ke,s.z.literal(f.GraphicComponent),s.z.literal(f.CheckoutComponent)]);const M=s.z.union([s.z.string(),s.z.number(),s.z.boolean()]),Ae=s.z.union([M,s.z.array(M),s.z.object({}),s.z.unknown()]),ye=s.z.object({$typ:s.z.literal("Error"),Id:s.z.string(),Message:s.z.string(),route:s.z.unknown().optional()});ye.or(Ae);const _=new Map;function Te(t){const n=G(t.name);_.has(n)||_.set(n,t)}class ze{constructor(n,e){d(this,"name");d(this,"zodType");this.name=n,this.zodType=e,Te(this)}async getValue(){return await D().getCmpValue(this.name)}async setInput(n){const e=G(this.name);await pe().setCmpInput(e,n,this.zodType)}onValueChanged(n,e=!1,i){D().onCmpValueChanged(this.name,n,i,e)}}var K=(t=>(t[t.Facebook=0]="Facebook",t[t.Pinterest=1]="Pinterest",t[t.Twitter=2]="Twitter",t[t.LinkedIn=3]="LinkedIn",t[t.WhatsApp=4]="WhatsApp",t[t.Custom=5]="Custom",t[t.NativeShare=6]="NativeShare",t))(K||{});const Be="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+X2ZkAAAAASUVORK5CYII=",W=T.onAnyCmpValueChanged.bind(T),H=async t=>{if(await T.finishConfiguration(t==null?void 0:t.input),t.sendDataToParentPage){const n=t.transformParentPageData();await w.sendConfigurationFinished(n)}},Q=async t=>{const n=K[t.platform],e=t.imageUrl??Be,i={...t,platform:n,imageUrl:e},r=await T.shareConfiguration(i);await j.openShareWindow(t.platform,r);const{shareUrl:ie,shareConfigurationId:oe}=r;return{shareUrl:ie,shareConfigurationId:oe}},X=()=>w.isInIFrame(),q=t=>w.setIFrameSize(t),Y=t=>j.navigateToLogin(t),J=(t,n)=>w.sendCustomMsg(t,n),ee=t=>w.redirectParentPage(t),te=()=>w.getParentPageUrl(),ne=(t,n)=>w.fireAnalyticsEvent(t,n),Ee=Object.freeze(Object.defineProperty({__proto__:null,configuratorIsInIFrame:X,finishConfiguration:H,fireAnalyticsEvent:ne,getParentPageUrl:te,navigateToLogin:Y,onAnyCmpValueChanged:W,redirectParentPage:ee,sendCustomMsgToParentPage:J,setConfiguratorIFrameSize:q,shareConfiguration:Q,version:O},Symbol.toStringTag,{value:"Module"}));console.log(`Loading custom code SDK v${O}`);exports.Button=ae;exports.CbnSdk=Ee;exports.Checkbox=de;exports.Collapsible=ce;exports.CustomControl=Ce;exports.Dataview=ge;exports.Input=ue;exports.Panel=le;exports.Text=he;exports.ValueComponent=ze;exports.configuratorIsInIFrame=X;exports.finishConfiguration=H;exports.fireAnalyticsEvent=ne;exports.getParentPageUrl=te;exports.navigateToLogin=Y;exports.onAnyCmpValueChanged=W;exports.redirectParentPage=ee;exports.sendCustomMsgToParentPage=J;exports.setConfiguratorIFrameSize=q;exports.shareConfiguration=Q;exports.version=O;
+"use strict";var de=Object.defineProperty;var D=t=>{throw TypeError(t)};var ce=(t,n,e)=>n in t?de(t,n,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[n]=e;var d=(t,n,e)=>ce(t,typeof n!="symbol"?n+"":n,e),M=(t,n,e)=>n.has(t)||D("Cannot "+e);var s=(t,n,e)=>(M(t,n,"read from private field"),e?e.call(t):n.get(t)),a=(t,n,e)=>n.has(t)?D("Cannot add the same private member more than once"):n instanceof WeakSet?n.add(t):n.set(t,e),C=(t,n,e,i)=>(M(t,n,"write to private field"),i?i.call(t,e):n.set(t,e),e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("zod"),L="0.0.1-alpha8";var S,l;class Ce{constructor(n){d(this,"id");a(this,S,"v1");a(this,l);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,S));if(C(this,l,e==null?void 0:e.getButtonSdkBridge(this.id)),!s(this,l))throw new Error(`Cannot access API for Button "${this.id}".`)}onRendered(n){var e;return((e=s(this,l))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}onClick(n){var e;return((e=s(this,l))==null?void 0:e.addOnClickCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=s(this,l))==null?void 0:e.setVisible(n))}setText(n){var e;(e=s(this,l))==null||e.setText(n)}}S=new WeakMap,l=new WeakMap;var T,g;class le{constructor(n){d(this,"id");a(this,T,"v1");a(this,g);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,T));if(C(this,g,e==null?void 0:e.getCheckboxSdkBridge(this.id)),!s(this,g))throw new Error(`Cannot access API for Checkbox "${this.id}".`)}onRendered(n){var e;return((e=s(this,g))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=s(this,g))==null?void 0:e.setVisible(n))}}T=new WeakMap,g=new WeakMap;var z,h;class ue{constructor(n){d(this,"id");a(this,z,"v1");a(this,h);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,z));if(C(this,h,e==null?void 0:e.getCollapsibleSdkBridge(this.id)),!s(this,h))throw new Error(`Cannot access API for Collapsible "${this.id}".`)}onRendered(n){var e;return((e=s(this,h))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=s(this,h))==null?void 0:e.setVisible(n))}}z=new WeakMap,h=new WeakMap;var B,c;class ge{constructor(n){d(this,"id");a(this,B,"v1");a(this,c);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,B));if(C(this,c,e==null?void 0:e.getCustomCtrlSdkBridge(this.id)),!s(this,c))throw new Error(`Cannot access API for Custom Control "${this.id}".`)}set renderFn(n){var e;(e=s(this,c))==null||e.setRenderFn(n)}async render(n){var e;typeof n=="function"&&(this.renderFn=n),await((e=s(this,c))==null?void 0:e.render())}onRendered(n){var e;return((e=s(this,c))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}getElement(){var e;return(e=s(this,c))==null?void 0:e.getElement()}async setVisible(n){var e;await((e=s(this,c))==null?void 0:e.setVisible(n))}}B=new WeakMap,c=new WeakMap;var E,b;class he{constructor(n){d(this,"id");a(this,E,"v1");a(this,b);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,E));if(C(this,b,e==null?void 0:e.getDataviewSdkBridge(this.id)),!s(this,b))throw new Error(`Cannot access API for Dataview "${this.id}".`)}onRendered(n){var e;return((e=s(this,b))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=s(this,b))==null?void 0:e.setVisible(n))}}E=new WeakMap,b=new WeakMap;var v,m;class be{constructor(n){d(this,"id");a(this,v,"v1");a(this,m);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,v));if(C(this,m,e==null?void 0:e.getInputSdkBridge(this.id)),!s(this,m))throw new Error(`Cannot access API for Input "${this.id}".`)}onRendered(n){var e;return((e=s(this,m))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=s(this,m))==null?void 0:e.setVisible(n))}}v=new WeakMap,m=new WeakMap;var R,p;class me{constructor(n){d(this,"id");a(this,R,"v1");a(this,p);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,R));if(C(this,p,e==null?void 0:e.getPanelSdkBridge(this.id)),!s(this,p))throw new Error(`Cannot access API for Panel "${this.id}".`)}onRendered(n){var e;return((e=s(this,p))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=s(this,p))==null?void 0:e.setVisible(n))}}R=new WeakMap,p=new WeakMap;var P,u;class pe{constructor(n){d(this,"id");a(this,P,"v1");a(this,u);var i,r;this.id=n;const e=(r=(i=window.Cbn)==null?void 0:i.getCustomCodeSdkBridge)==null?void 0:r.call(i,s(this,P));if(C(this,u,e==null?void 0:e.getTextSdkBridge(this.id)),!s(this,u))throw new Error(`Cannot access API for Text "${this.id}".`)}onRendered(n){var e;return((e=s(this,u))==null?void 0:e.addOnRenderedCallback(n))??{unsubscribe:()=>{}}}async setVisible(n){var e;await((e=s(this,u))==null?void 0:e.setVisible(n))}setText(n){var e;(e=s(this,u))==null||e.setText(n)}}P=new WeakMap,u=new WeakMap;const _=1,y=[];function we(t,n){if(y.length>=_)throw new Error(`Only ${_} \`ConfiguratorClient\` can be created at a time.`);y.push({client:t,internals:n})}function N(){const t=y[0];if(!t)throw new Error("Operation not possible as no `ConfiguratorClient` has been registered yet.");return t.client}function fe(){const t=y[0];if(!t)throw new Error("Operation not possible as no `ConfiguratorClient` has been registered yet.");return t.internals}const ke="v1";var A,G;const O=(G=(A=window.Cbn)==null?void 0:A.getCustomCodeSdkBridge)==null?void 0:G.call(A,"v1");if(!O)throw new Error("Cannot access Configurator SDK bridge. Make sure to only use the `custom-code-sdk` inside a Combeenation Configurator.");const K=O.createCfgrClient(ke,we);if(!K)throw new Error("Cannot create Configurator Client. Make sure to only use the `custom-code-sdk` inside a Combeenation Configurator.");const w=O.getParentPageUtilsSdkBridge(),U=O.getCfgrUtilsSdkBridge(),I=K,x={Text:"Text",Number:"Number",Logic:"Logic"},f={ValueComponent:"ValueComponent",TableComponent:"TableComponent",RecordComponent:"RecordComponent",ResourceComponent:"ResourceComponent",GraphicComponent:"GraphicComponent",CheckoutComponent:"CheckoutComponent"},k={ValueEditor:"ValueEditor",TableEditor:"TableEditor",Fiber:"Fiber",FiberEditor:"FiberEditor",CfgrField:"CfgrField"};o.z.enum([k.ValueEditor,k.TableEditor,k.Fiber,k.FiberEditor,k.CfgrField]);o.z.union([o.z.string(),o.z.number(),o.z.boolean()]);const V=t=>typeof t=="string";o.z.string();o.z.enum([x.Text,x.Number,x.Logic]);o.z.string();o.z.custom(t=>V(t)&&t.toLowerCase()===t);const W=t=>(t==null?void 0:t.toLowerCase())??"";o.z.string();const Ve=o.z.custom(t=>V(t)?new RegExp(`^${f.ValueComponent}<.*>$`).test(t):!1),Ae=o.z.custom(t=>V(t)?new RegExp(`^${f.RecordComponent}<.*>$`).test(t):!1),ye=o.z.custom(t=>V(t)?new RegExp(`^${f.ResourceComponent}<.*>$`).test(t):!1),Ie=o.z.custom(t=>V(t)?new RegExp(`^${f.TableComponent}<.*>$`).test(t):!1);o.z.union([Ve,Ie,Ae,ye,o.z.literal(f.GraphicComponent),o.z.literal(f.CheckoutComponent)]);const Z=o.z.union([o.z.string(),o.z.number(),o.z.boolean()]),Se=o.z.union([Z,o.z.array(Z),o.z.object({}),o.z.unknown()]),Te=o.z.object({$typ:o.z.literal("Error"),Id:o.z.string(),Message:o.z.string(),route:o.z.unknown().optional()});Te.or(Se);const j=new Map;function ze(t){const n=W(t.name);j.has(n)||j.set(n,t)}class Be{constructor(n,e){d(this,"name");d(this,"zodType");this.name=n,this.zodType=e,ze(this)}async getValue(){return await N().getCmpValue(this.name)}async setInput(n){const e=W(this.name);await fe().setCmpInput(e,n,this.zodType)}onValueChanged(n,e=!1,i){N().onCmpValueChanged(this.name,n,i,e)}}const H=()=>U.getAssetPaths();var Q=(t=>(t[t.Facebook=0]="Facebook",t[t.Pinterest=1]="Pinterest",t[t.Twitter=2]="Twitter",t[t.LinkedIn=3]="LinkedIn",t[t.WhatsApp=4]="WhatsApp",t[t.Custom=5]="Custom",t[t.NativeShare=6]="NativeShare",t))(Q||{});const Ee="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+X2ZkAAAAASUVORK5CYII=",X=I.onAnyCmpValueChanged.bind(I),q=async t=>{if(await I.finishConfiguration(t==null?void 0:t.input),t.sendDataToParentPage){const n=t.transformParentPageData();await w.sendConfigurationFinished(n)}},Y=async t=>{const n=Q[t.platform],e=t.imageUrl??Ee,i={...t,platform:n,imageUrl:e},r=await I.shareConfiguration(i);await U.openShareWindow(t.platform,r);const{shareUrl:F,shareConfigurationId:$}=r;return{shareUrl:F,shareConfigurationId:$}},J=async t=>{const{promise:n,resolve:e}=Promise.withResolvers(),i={};for(const[r,F]of Object.entries(t))F.onValueChanged($=>{i[r]=$,Object.keys(t).every(ae=>ae in i)&&e(i)},!0);return n},ee=()=>w.isInIFrame(),te=t=>w.setIFrameSize(t),ne=t=>U.navigateToLogin(t),ie=(t,n)=>w.sendCustomMsg(t,n),se=t=>w.redirectParentPage(t),oe=()=>w.getParentPageUrl(),re=(t,n)=>w.fireAnalyticsEvent(t,n),ve=Object.freeze(Object.defineProperty({__proto__:null,configuratorIsInIFrame:ee,createSyncCmpValuesStore:J,finishConfiguration:q,fireAnalyticsEvent:re,getAssetPaths:H,getParentPageUrl:oe,navigateToLogin:ne,onAnyCmpValueChanged:X,redirectParentPage:se,sendCustomMsgToParentPage:ie,setConfiguratorIFrameSize:te,shareConfiguration:Y,version:L},Symbol.toStringTag,{value:"Module"}));console.log(`Loading custom code SDK v${L}`);exports.Button=Ce;exports.CbnSdk=ve;exports.Checkbox=le;exports.Collapsible=ue;exports.CustomControl=ge;exports.Dataview=he;exports.Input=be;exports.Panel=me;exports.Text=pe;exports.ValueComponent=Be;exports.configuratorIsInIFrame=ee;exports.createSyncCmpValuesStore=J;exports.finishConfiguration=q;exports.fireAnalyticsEvent=re;exports.getAssetPaths=H;exports.getParentPageUrl=oe;exports.navigateToLogin=ne;exports.onAnyCmpValueChanged=X;exports.redirectParentPage=se;exports.sendCustomMsgToParentPage=ie;exports.setConfiguratorIFrameSize=te;exports.shareConfiguration=Y;exports.version=L;

package/dist/bundle.es.js

@@ -1,54 +1,54 @@
-var Q = Object.defineProperty;
-var O = (t) => {
+var X = Object.defineProperty;
+var D = (t) => {
   throw TypeError(t);
 };
-var X = (t, n, e) => n in t ? Q(t, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[n] = e;
-var d = (t, n, e) => X(t, typeof n != "symbol" ? n + "" : n, e), L = (t, n, e) => n.has(t) || O("Cannot " + e);
-var s = (t, n, e) => (L(t, n, "read from private field"), e ? e.call(t) : n.get(t)), a = (t, n, e) => n.has(t) ? O("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(t) : n.set(t, e), c = (t, n, e, i) => (L(t, n, "write to private field"), i ? i.call(t, e) : n.set(t, e), e);
+var Y = (t, n, e) => n in t ? X(t, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[n] = e;
+var d = (t, n, e) => Y(t, typeof n != "symbol" ? n + "" : n, e), _ = (t, n, e) => n.has(t) || D("Cannot " + e);
+var s = (t, n, e) => (_(t, n, "read from private field"), e ? e.call(t) : n.get(t)), a = (t, n, e) => n.has(t) ? D("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(t) : n.set(t, e), C = (t, n, e, i) => (_(t, n, "write to private field"), i ? i.call(t, e) : n.set(t, e), e);
 import { z as o } from "zod";
-const z = "0.0.1-alpha7";
-var E, C;
-class ke {
+const G = "0.0.1-alpha8";
+var E, l;
+class Be {
   constructor(n) {
     d(this, "id");
     a(this, E, "v1");
-    a(this, C);
+    a(this, l);
     var i, r;
     this.id = n;
     const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, E));
-    if (c(this, C, e == null ? void 0 : e.getButtonSdkBridge(this.id)), !s(this, C))
+    if (C(this, l, e == null ? void 0 : e.getButtonSdkBridge(this.id)), !s(this, l))
       throw new Error(`Cannot access API for Button "${this.id}".`);
   }
   onRendered(n) {
     var e;
-    return ((e = s(this, C)) == null ? void 0 : e.addOnRenderedCallback(n)) ?? { unsubscribe: () => {
+    return ((e = s(this, l)) == null ? void 0 : e.addOnRenderedCallback(n)) ?? { unsubscribe: () => {
     } };
   }
   onClick(n) {
     var e;
-    return ((e = s(this, C)) == null ? void 0 : e.addOnClickCallback(n)) ?? { unsubscribe: () => {
+    return ((e = s(this, l)) == null ? void 0 : e.addOnClickCallback(n)) ?? { unsubscribe: () => {
     } };
   }
   async setVisible(n) {
     var e;
-    await ((e = s(this, C)) == null ? void 0 : e.setVisible(n));
+    await ((e = s(this, l)) == null ? void 0 : e.setVisible(n));
   }
   setText(n) {
     var e;
-    (e = s(this, C)) == null || e.setText(n);
+    (e = s(this, l)) == null || e.setText(n);
   }
 }
-E = new WeakMap(), C = new WeakMap();
-var T, g;
-class Ve {
+E = new WeakMap(), l = new WeakMap();
+var I, g;
+class Ee {
   constructor(n) {
     d(this, "id");
-    a(this, T, "v1");
+    a(this, I, "v1");
     a(this, g);
     var i, r;
     this.id = n;
-    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, T));
-    if (c(this, g, e == null ? void 0 : e.getCheckboxSdkBridge(this.id)), !s(this, g))
+    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, I));
+    if (C(this, g, e == null ? void 0 : e.getCheckboxSdkBridge(this.id)), !s(this, g))
       throw new Error(`Cannot access API for Checkbox "${this.id}".`);
   }
   onRendered(n) {
@@ -61,17 +61,17 @@ class Ve {
     await ((e = s(this, g)) == null ? void 0 : e.setVisible(n));
   }
 }
-T = new WeakMap(), g = new WeakMap();
-var I, h;
-class Ae {
+I = new WeakMap(), g = new WeakMap();
+var T, h;
+class Ie {
   constructor(n) {
     d(this, "id");
-    a(this, I, "v1");
+    a(this, T, "v1");
     a(this, h);
     var i, r;
     this.id = n;
-    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, I));
-    if (c(this, h, e == null ? void 0 : e.getCollapsibleSdkBridge(this.id)), !s(this, h))
+    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, T));
+    if (C(this, h, e == null ? void 0 : e.getCollapsibleSdkBridge(this.id)), !s(this, h))
       throw new Error(`Cannot access API for Collapsible "${this.id}".`);
   }
   onRendered(n) {
@@ -84,66 +84,105 @@ class Ae {
     await ((e = s(this, h)) == null ? void 0 : e.setVisible(n));
   }
 }
-I = new WeakMap(), h = new WeakMap();
-var S, l;
-class ye {
+T = new WeakMap(), h = new WeakMap();
+var R, c;
+class Te {
   constructor(n) {
     d(this, "id");
-    a(this, S, "v1");
-    a(this, l);
+    a(this, R, "v1");
+    a(this, c);
     var i, r;
     this.id = n;
-    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, S));
-    if (c(this, l, e == null ? void 0 : e.getCustomCtrlSdkBridge(this.id)), !s(this, l))
+    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, R));
+    if (C(this, c, e == null ? void 0 : e.getCustomCtrlSdkBridge(this.id)), !s(this, c))
       throw new Error(`Cannot access API for Custom Control "${this.id}".`);
   }
   /**
-   * Things to mention when writing docs:
-   *   - The `renderFn` is always meant to actively render/set the content/innerHTML of the given `element`.
-   *     ATM, system does sometimes pass a "pre-rendered" `element` but that will change in the future when introducing
-   *     some dedicated ctrl property like "Custom control controlled/custom control rendered/...".
-   *   - Assigning a new fn does not trigger a re-render
-   *   - Explain, when this fn is being called (automatically on show, manually on `.render()`)
-   *   - Explain, why this should be used instead of a pattern like the following:
-   *     ```ts
-   *     const el = myCtrl.getElement();
-   *     el.innerHTML = '...';
-   *     ```
-   *   - Explain difference to `onRendered` (see comments on `useCustomCodeSdkBridgeStoreBase`)
-   *   - ...
+   * This gives custom code full control over what is rendered inside the control. When setting this function, custom
+   * code is responsible to actively render/set the content/innerHTML of the given `element` inside the
+   * {@link renderFn}.
+   *
+   * The configurator will not render any content inside the control when a {@link renderFn} is set.
+   *
+   * For the {@link renderFn} to work, the property `Custom code controlled` needs to be enabled on the control.
+   * The {@link renderFn} will be ignored when `Custom code controlled` is not enabled.
+   *
+   * Good to know:
+   *   - Setting a new {@link renderFn} does not trigger a re-render.\
+   *     Use {@link render} if you want to trigger a re-render after setting a new {@link renderFn}.
+   *   - There can only be one {@link renderFn} per control. Setting a new one will override the existing one.
+   *   - The {@link renderFn} will be called in the following scenarios:
+   *     - Everytime the control is being shown. This is on initial show as well as when toggling its visibility.
+   *     - When forcing a render via the {@link render} method.
+   *   - Difference to {@link onRendered}:
+   *     - The {@link renderFn} is meant to control the rendered content whilst {@link onRendered} is a classic event
+   *       listener which allows you to perform certain actions like installing event listener on DOM nodes etc.
+   *       **after** the content has been rendered.
+   *     - You can install multiple {@link onRendered} callbacks.
+   *     - The {@link renderFn} and {@link onRendered} callbacks can be used side by side.
+   *   - The {@link renderFn} should always be used instead of manually manipulating the DOM via vanilla JS.\
+   *     When manipulating the DOM outside of the {@link renderFn}, your changes can always be overridden by the
+   *     configurator.\
+   *     Using the {@link renderFn} ensures that your changes are applied in a stable and predictable way.
    */
   set renderFn(n) {
     var e;
-    (e = s(this, l)) == null || e.setRenderFn(n);
+    (e = s(this, c)) == null || e.setRenderFn(n);
   }
   /**
-   * @param renderFn Convenience param which allows setting the `renderFn` and triggering a render in one call.
-   *                 The `renderFn` will be permanently installed and will override any existing `renderFn`.
+   * Forces a re-render of the control.
+   *
+   * @param renderFn Convenience param which allows setting the {@link renderFn} and triggering a render in one call.
+   *                 The given `renderFn` will be permanently installed and will override any previously set
+   *                 {@link renderFn}.
    */
   async render(n) {
     var e;
-    typeof n == "function" && (this.renderFn = n), await ((e = s(this, l)) == null ? void 0 : e.render());
+    typeof n == "function" && (this.renderFn = n), await ((e = s(this, c)) == null ? void 0 : e.render());
+  }
+  /**
+   * This allows custom code to register callbacks in which it can perform certain actions like installing event
+   * listeners on DOM nodes or adding CSS classes etc. **after** the control has been rendered.
+   *
+   * The control can be rendered in the following scenarios:
+   *   - Everytime the control is being shown. This is on initial show as well as when toggling its visibility.
+   *   - When forcing a render via the {@link render} method.
+   *   - When the value of the control's `HTML` property changes e.g. via Hive in controls.
+   *
+   * !!! Important !!!
+   *
+   * This is **not** meant to be used for manipulating the rendered content of the control besides simple,
+   * non-structural/-behavioral changes like adding CSS classes or data attributes etc.
+   *
+   * For manipulating/controlling the rendered content, use the {@link renderFn} instead.
+   *
+   * See {@link renderFn} for more differences between the two.
+   */
+  onRendered(n) {
+    var e;
+    return ((e = s(this, c)) == null ? void 0 : e.addOnRenderedCallback(n)) ?? { unsubscribe: () => {
+    } };
   }
   getElement() {
     var e;
-    return (e = s(this, l)) == null ? void 0 : e.getElement();
+    return (e = s(this, c)) == null ? void 0 : e.getElement();
   }
   async setVisible(n) {
     var e;
-    await ((e = s(this, l)) == null ? void 0 : e.setVisible(n));
+    await ((e = s(this, c)) == null ? void 0 : e.setVisible(n));
   }
 }
-S = new WeakMap(), l = new WeakMap();
-var R, b;
-class Be {
+R = new WeakMap(), c = new WeakMap();
+var S, b;
+class Re {
   constructor(n) {
     d(this, "id");
-    a(this, R, "v1");
+    a(this, S, "v1");
     a(this, b);
     var i, r;
     this.id = n;
-    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, R));
-    if (c(this, b, e == null ? void 0 : e.getDataviewSdkBridge(this.id)), !s(this, b))
+    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, S));
+    if (C(this, b, e == null ? void 0 : e.getDataviewSdkBridge(this.id)), !s(this, b))
       throw new Error(`Cannot access API for Dataview "${this.id}".`);
   }
   onRendered(n) {
@@ -156,9 +195,9 @@ class Be {
     await ((e = s(this, b)) == null ? void 0 : e.setVisible(n));
   }
 }
-R = new WeakMap(), b = new WeakMap();
+S = new WeakMap(), b = new WeakMap();
 var v, p;
-class Ee {
+class Se {
   constructor(n) {
     d(this, "id");
     a(this, v, "v1");
@@ -166,7 +205,7 @@ class Ee {
     var i, r;
     this.id = n;
     const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, v));
-    if (c(this, p, e == null ? void 0 : e.getInputSdkBridge(this.id)), !s(this, p))
+    if (C(this, p, e == null ? void 0 : e.getInputSdkBridge(this.id)), !s(this, p))
       throw new Error(`Cannot access API for Input "${this.id}".`);
   }
   onRendered(n) {
@@ -181,7 +220,7 @@ class Ee {
 }
 v = new WeakMap(), p = new WeakMap();
 var P, m;
-class Te {
+class ve {
   constructor(n) {
     d(this, "id");
     a(this, P, "v1");
@@ -189,7 +228,7 @@ class Te {
     var i, r;
     this.id = n;
     const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, P));
-    if (c(this, m, e == null ? void 0 : e.getPanelSdkBridge(this.id)), !s(this, m))
+    if (C(this, m, e == null ? void 0 : e.getPanelSdkBridge(this.id)), !s(this, m))
       throw new Error(`Cannot access API for Panel "${this.id}".`);
   }
   onRendered(n) {
@@ -203,16 +242,16 @@ class Te {
   }
 }
 P = new WeakMap(), m = new WeakMap();
-var $, u;
-class Ie {
+var O, u;
+class Pe {
   constructor(n) {
     d(this, "id");
-    a(this, $, "v1");
+    a(this, O, "v1");
     a(this, u);
     var i, r;
     this.id = n;
-    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, $));
-    if (c(this, u, e == null ? void 0 : e.getTextSdkBridge(this.id)), !s(this, u))
+    const e = (r = (i = window.Cbn) == null ? void 0 : i.getCustomCodeSdkBridge) == null ? void 0 : r.call(i, s(this, O));
+    if (C(this, u, e == null ? void 0 : e.getTextSdkBridge(this.id)), !s(this, u))
       throw new Error(`Cannot access API for Text "${this.id}".`);
   }
   onRendered(n) {
@@ -229,38 +268,38 @@ class Ie {
     (e = s(this, u)) == null || e.setText(n);
   }
 }
-$ = new WeakMap(), u = new WeakMap();
-const U = 1, y = [];
-function Y(t, n) {
-  if (y.length >= U)
-    throw new Error(`Only ${U} \`ConfiguratorClient\` can be created at a time.`);
+O = new WeakMap(), u = new WeakMap();
+const M = 1, y = [];
+function q(t, n) {
+  if (y.length >= M)
+    throw new Error(`Only ${M} \`ConfiguratorClient\` can be created at a time.`);
   y.push({ client: t, internals: n });
 }
-function D() {
+function N() {
   const t = y[0];
   if (!t)
     throw new Error("Operation not possible as no `ConfiguratorClient` has been registered yet.");
   return t.client;
 }
-function q() {
+function J() {
   const t = y[0];
   if (!t)
     throw new Error("Operation not possible as no `ConfiguratorClient` has been registered yet.");
   return t.internals;
 }
-const J = "v1";
-var A, Z;
-const F = (Z = (A = window.Cbn) == null ? void 0 : A.getCustomCodeSdkBridge) == null ? void 0 : Z.call(A, "v1");
-if (!F)
+const ee = "v1";
+var A, j;
+const $ = (j = (A = window.Cbn) == null ? void 0 : A.getCustomCodeSdkBridge) == null ? void 0 : j.call(A, "v1");
+if (!$)
   throw new Error(
     "Cannot access Configurator SDK bridge. Make sure to only use the `custom-code-sdk` inside a Combeenation Configurator."
   );
-const N = F.createCfgrClient(J, Y);
-if (!N)
+const K = $.createCfgrClient(ee, q);
+if (!K)
   throw new Error(
     "Cannot create Configurator Client. Make sure to only use the `custom-code-sdk` inside a Combeenation Configurator."
   );
-const w = F.getParentPageUtilsSdkBridge(), j = F.getCfgrUtilsSdkBridge(), B = N, x = {
+const w = $.getParentPageUtilsSdkBridge(), U = $.getCfgrUtilsSdkBridge(), B = K, L = {
   Text: "Text",
   Number: "Number",
   Logic: "Logic"
@@ -296,29 +335,29 @@ o.enum([
 o.union([o.string(), o.number(), o.boolean()]);
 const V = (t) => typeof t == "string";
 o.string();
-o.enum([x.Text, x.Number, x.Logic]);
+o.enum([L.Text, L.Number, L.Logic]);
 o.string();
 o.custom((t) => V(t) && t.toLowerCase() === t);
-const G = (t) => (t == null ? void 0 : t.toLowerCase()) ?? "";
+const W = (t) => (t == null ? void 0 : t.toLowerCase()) ?? "";
 o.string();
-const ee = o.custom(
+const te = o.custom(
   (t) => V(t) ? new RegExp(`^${f.ValueComponent}<.*>$`).test(t) : !1
-), te = o.custom(
-  (t) => V(t) ? new RegExp(`^${f.RecordComponent}<.*>$`).test(t) : !1
 ), ne = o.custom(
-  (t) => V(t) ? new RegExp(`^${f.ResourceComponent}<.*>$`).test(t) : !1
+  (t) => V(t) ? new RegExp(`^${f.RecordComponent}<.*>$`).test(t) : !1
 ), ie = o.custom(
+  (t) => V(t) ? new RegExp(`^${f.ResourceComponent}<.*>$`).test(t) : !1
+), se = o.custom(
   (t) => V(t) ? new RegExp(`^${f.TableComponent}<.*>$`).test(t) : !1
 );
 o.union([
-  ee,
-  ie,
   te,
+  se,
   ne,
+  ie,
   o.literal(f.GraphicComponent),
   o.literal(f.CheckoutComponent)
 ]);
-const _ = o.union([o.string(), o.number(), o.boolean()]), se = o.union([_, o.array(_), o.object({}), o.unknown()]), oe = o.object({
+const Z = o.union([o.string(), o.number(), o.boolean()]), oe = o.union([Z, o.array(Z), o.object({}), o.unknown()]), re = o.object({
   $typ: o.literal("Error"),
   // TODO WTT: Introduce more specific typing here for known error IDs etc.? Maybe in combination w/ some server
   //           generated enum?
@@ -332,30 +371,30 @@ const _ = o.union([o.string(), o.number(), o.boolean()]), se = o.union([_, o.arr
    */
   route: o.unknown().optional()
 });
-oe.or(se);
-const M = /* @__PURE__ */ new Map();
-function re(t) {
-  const n = G(t.name);
-  M.has(n) || M.set(n, t);
+re.or(oe);
+const z = /* @__PURE__ */ new Map();
+function ae(t) {
+  const n = W(t.name);
+  z.has(n) || z.set(n, t);
 }
-class Se {
+class Oe {
   constructor(n, e) {
     d(this, "name");
     d(this, "zodType");
-    this.name = n, this.zodType = e, re(this);
+    this.name = n, this.zodType = e, ae(this);
   }
   /**
    * Function for receiving the value of a component.
    */
   async getValue() {
-    return await D().getCmpValue(this.name);
+    return await N().getCmpValue(this.name);
   }
   /**
    * Sends the ChangeConfigurationValue request to the server
    */
   async setInput(n) {
-    const e = G(this.name);
-    await q().setCmpInput(e, n, this.zodType);
+    const e = W(this.name);
+    await J().setCmpInput(e, n, this.zodType);
   }
   /**
    * @param listener        Called whenever the value of the given cmp has changed
@@ -367,55 +406,67 @@ class Se {
    *                        The function can decide on whether the listener is called or not by returning true or false.
    */
   onValueChanged(n, e = !1, i) {
-    D().onCmpValueChanged(this.name, n, i, e);
+    N().onCmpValueChanged(this.name, n, i, e);
   }
 }
-var K = /* @__PURE__ */ ((t) => (t[t.Facebook = 0] = "Facebook", t[t.Pinterest = 1] = "Pinterest", t[t.Twitter = 2] = "Twitter", t[t.LinkedIn = 3] = "LinkedIn", t[t.WhatsApp = 4] = "WhatsApp", t[t.Custom = 5] = "Custom", t[t.NativeShare = 6] = "NativeShare", t))(K || {});
-const ae = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+X2ZkAAAAASUVORK5CYII=", de = B.onAnyCmpValueChanged.bind(B), ce = async (t) => {
+const de = () => U.getAssetPaths();
+var H = /* @__PURE__ */ ((t) => (t[t.Facebook = 0] = "Facebook", t[t.Pinterest = 1] = "Pinterest", t[t.Twitter = 2] = "Twitter", t[t.LinkedIn = 3] = "LinkedIn", t[t.WhatsApp = 4] = "WhatsApp", t[t.Custom = 5] = "Custom", t[t.NativeShare = 6] = "NativeShare", t))(H || {});
+const ce = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+X2ZkAAAAASUVORK5CYII=", Ce = B.onAnyCmpValueChanged.bind(B), le = async (t) => {
   if (await B.finishConfiguration(t == null ? void 0 : t.input), t.sendDataToParentPage) {
     const n = t.transformParentPageData();
     await w.sendConfigurationFinished(n);
   }
-}, Ce = async (t) => {
-  const n = K[t.platform], e = t.imageUrl ?? ae, i = { ...t, platform: n, imageUrl: e }, r = await B.shareConfiguration(i);
-  await j.openShareWindow(t.platform, r);
-  const { shareUrl: W, shareConfigurationId: H } = r;
-  return { shareUrl: W, shareConfigurationId: H };
-}, le = () => w.isInIFrame(), ue = (t) => w.setIFrameSize(t), ge = (t) => j.navigateToLogin(t), he = (t, n) => w.sendCustomMsg(t, n), be = (t) => w.redirectParentPage(t), pe = () => w.getParentPageUrl(), me = (t, n) => w.fireAnalyticsEvent(t, n), Re = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, ue = async (t) => {
+  const n = H[t.platform], e = t.imageUrl ?? ce, i = { ...t, platform: n, imageUrl: e }, r = await B.shareConfiguration(i);
+  await U.openShareWindow(t.platform, r);
+  const { shareUrl: F, shareConfigurationId: x } = r;
+  return { shareUrl: F, shareConfigurationId: x };
+}, ge = async (t) => {
+  const { promise: n, resolve: e } = Promise.withResolvers(), i = {};
+  for (const [r, F] of Object.entries(t))
+    F.onValueChanged((x) => {
+      i[r] = x, Object.keys(t).every((Q) => Q in i) && e(i);
+    }, !0);
+  return n;
+}, he = () => w.isInIFrame(), be = (t) => w.setIFrameSize(t), pe = (t) => U.navigateToLogin(t), me = (t, n) => w.sendCustomMsg(t, n), we = (t) => w.redirectParentPage(t), fe = () => w.getParentPageUrl(), ke = (t, n) => w.fireAnalyticsEvent(t, n), $e = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  configuratorIsInIFrame: le,
-  finishConfiguration: ce,
-  fireAnalyticsEvent: me,
-  getParentPageUrl: pe,
-  navigateToLogin: ge,
-  onAnyCmpValueChanged: de,
-  redirectParentPage: be,
-  sendCustomMsgToParentPage: he,
-  setConfiguratorIFrameSize: ue,
-  shareConfiguration: Ce,
-  version: z
+  configuratorIsInIFrame: he,
+  createSyncCmpValuesStore: ge,
+  finishConfiguration: le,
+  fireAnalyticsEvent: ke,
+  getAssetPaths: de,
+  getParentPageUrl: fe,
+  navigateToLogin: pe,
+  onAnyCmpValueChanged: Ce,
+  redirectParentPage: we,
+  sendCustomMsgToParentPage: me,
+  setConfiguratorIFrameSize: be,
+  shareConfiguration: ue,
+  version: G
 }, Symbol.toStringTag, { value: "Module" }));
-console.log(`Loading custom code SDK v${z}`);
+console.log(`Loading custom code SDK v${G}`);
 export {
-  ke as Button,
-  Re as CbnSdk,
-  Ve as Checkbox,
-  Ae as Collapsible,
-  ye as CustomControl,
-  Be as Dataview,
-  Ee as Input,
-  Te as Panel,
-  Ie as Text,
-  Se as ValueComponent,
-  le as configuratorIsInIFrame,
-  ce as finishConfiguration,
-  me as fireAnalyticsEvent,
-  pe as getParentPageUrl,
-  ge as navigateToLogin,
-  de as onAnyCmpValueChanged,
-  be as redirectParentPage,
-  he as sendCustomMsgToParentPage,
-  ue as setConfiguratorIFrameSize,
-  Ce as shareConfiguration,
-  z as version
+  Be as Button,
+  $e as CbnSdk,
+  Ee as Checkbox,
+  Ie as Collapsible,
+  Te as CustomControl,
+  Re as Dataview,
+  Se as Input,
+  ve as Panel,
+  Pe as Text,
+  Oe as ValueComponent,
+  he as configuratorIsInIFrame,
+  ge as createSyncCmpValuesStore,
+  le as finishConfiguration,
+  ke as fireAnalyticsEvent,
+  de as getAssetPaths,
+  fe as getParentPageUrl,
+  pe as navigateToLogin,
+  Ce as onAnyCmpValueChanged,
+  we as redirectParentPage,
+  me as sendCustomMsgToParentPage,
+  be as setConfiguratorIFrameSize,
+  ue as shareConfiguration,
+  G as version
 };

package/dist/index.d.ts

@@ -2,6 +2,8 @@ import { z } from 'zod';
 
 declare type AppLanguage = 'en' | 'de';
 
+declare type AssetName = z.infer<typeof ZAssetName>;
+
 export declare class Button {
     #private;
     readonly id: CtrlId;
@@ -21,6 +23,7 @@ export declare namespace CbnSdk {
         configuratorIsInIFrame,
         finishConfiguration,
         fireAnalyticsEvent,
+        getAssetPaths,
         getParentPageUrl,
         navigateToLogin,
         onAnyCmpValueChanged,
@@ -28,6 +31,7 @@ export declare namespace CbnSdk {
         sendCustomMsgToParentPage,
         setConfiguratorIFrameSize,
         shareConfiguration,
+        createSyncCmpValuesStore,
         version
     }
 }
@@ -89,6 +93,64 @@ export declare class Collapsible {
  */
 export declare const configuratorIsInIFrame: () => boolean;
 
+/**
+ * Creates a store holding component values which can be accessed synchronously.
+ *
+ * This is meant as an alternative to the async value access via `await cmp.getValue()` for situations where the async
+ * access is especially cumbersome.
+ *
+ * E.g.:
+ * ```ts
+ * const amount = await Amount.getValue();
+ * // vs.
+ * const amount = cmpValues.Amount;
+ * ```
+ *
+ * !!! Note !!!
+ *
+ * This shall not be used as the default way of accessing component values.\
+ * Using this extensively can have negative impact on the performance of your configurator.
+ *
+ * Avoid using this with too many components or components that hold very large values which change frequently.
+ *
+ * @returns An object holding the current value of each of the given `cmps`.\
+ *          The keys of the properties in the returned object are the same as in the given `cmps`.
+ *
+ * @example
+ * ```ts
+ * // Create the store once and export for later use:
+ * import { Amount, ItemPrice } from './typings/cfgr-defs.generated';
+ * export const cmpValues = await createSyncCmpValuesStore({ Amount, ItemPrice });
+ *
+ * // Later in the code, access the values synchronously like this:
+ * const amount = cmpValues.Amount;
+ * const itemPrice = cmpValues.ItemPrice;
+ * // or:
+ * const { Amount: amount, ItemPrice: itemPrice } = cmpValues;
+ * ```
+ *
+ * !!! Important !!!
+ *
+ * Once the values of the returned store have been extracted, they will not update anymore.\
+ * -> Only extract the values in sync contexts.
+ *
+ * E.g.:
+ * ```ts
+ * import { cmpValues } from './path/to/store';
+ *
+ * const amount = cmpValues.Amount; // Current value of Amount is 10
+ *
+ * button.onClick(() => {
+ *   // The value of Amount changed to 20 in the meantime
+ *   console.log(amount); // 🔥 Stale value 10
+ *   console.log(cmpValues.Amount); // ✅ Latest value 20
+ * });
+ * ```
+ */
+export declare const createSyncCmpValuesStore: <TCmps extends {
+    [id: CmpName]: ValueComponent;
+}>(cmps: TCmps) => Promise<Readonly<SyncCmpValuesStore<TCmps>>>;
+
 declare type CtrlId = z.infer<typeof ZCtrlId>;
 
 export declare class CustomControl {
@@ -96,30 +158,69 @@ export declare class CustomControl {
     readonly id: CtrlId;
     constructor(id: CtrlId);
     /**
-     * Things to mention when writing docs:
-     *   - The `renderFn` is always meant to actively render/set the content/innerHTML of the given `element`.
-     *     ATM, system does sometimes pass a "pre-rendered" `element` but that will change in the future when introducing
-     *     some dedicated ctrl property like "Custom control controlled/custom control rendered/...".
-     *   - Assigning a new fn does not trigger a re-render
-     *   - Explain, when this fn is being called (automatically on show, manually on `.render()`)
-     *   - Explain, why this should be used instead of a pattern like the following:
-     *     ```ts
-     *     const el = myCtrl.getElement();
-     *     el.innerHTML = '...';
-     *     ```
-     *   - Explain difference to `onRendered` (see comments on `useCustomCodeSdkBridgeStoreBase`)
-     *   - ...
+     * This gives custom code full control over what is rendered inside the control. When setting this function, custom
+     * code is responsible to actively render/set the content/innerHTML of the given `element` inside the
+     * {@link renderFn}.
+     *
+     * The configurator will not render any content inside the control when a {@link renderFn} is set.
+     *
+     * For the {@link renderFn} to work, the property `Custom code controlled` needs to be enabled on the control.
+     * The {@link renderFn} will be ignored when `Custom code controlled` is not enabled.
+     *
+     * Good to know:
+     *   - Setting a new {@link renderFn} does not trigger a re-render.\
+     *     Use {@link render} if you want to trigger a re-render after setting a new {@link renderFn}.
+     *   - There can only be one {@link renderFn} per control. Setting a new one will override the existing one.
+     *   - The {@link renderFn} will be called in the following scenarios:
+     *     - Everytime the control is being shown. This is on initial show as well as when toggling its visibility.
+     *     - When forcing a render via the {@link render} method.
+     *   - Difference to {@link onRendered}:
+     *     - The {@link renderFn} is meant to control the rendered content whilst {@link onRendered} is a classic event
+     *       listener which allows you to perform certain actions like installing event listener on DOM nodes etc.
+     *       **after** the content has been rendered.
+     *     - You can install multiple {@link onRendered} callbacks.
+     *     - The {@link renderFn} and {@link onRendered} callbacks can be used side by side.
+     *   - The {@link renderFn} should always be used instead of manually manipulating the DOM via vanilla JS.\
+     *     When manipulating the DOM outside of the {@link renderFn}, your changes can always be overridden by the
+     *     configurator.\
+     *     Using the {@link renderFn} ensures that your changes are applied in a stable and predictable way.
      */
     set renderFn(callback: CustomCtrlRenderFn);
     /**
-     * @param renderFn Convenience param which allows setting the `renderFn` and triggering a render in one call.
-     *                 The `renderFn` will be permanently installed and will override any existing `renderFn`.
+     * Forces a re-render of the control.
+     *
+     * @param renderFn Convenience param which allows setting the {@link renderFn} and triggering a render in one call.
+     *                 The given `renderFn` will be permanently installed and will override any previously set
+     *                 {@link renderFn}.
      */
     render(renderFn?: CustomCtrlRenderFn): Promise<void>;
+    /**
+     * This allows custom code to register callbacks in which it can perform certain actions like installing event
+     * listeners on DOM nodes or adding CSS classes etc. **after** the control has been rendered.
+     *
+     * The control can be rendered in the following scenarios:
+     *   - Everytime the control is being shown. This is on initial show as well as when toggling its visibility.
+     *   - When forcing a render via the {@link render} method.
+     *   - When the value of the control's `HTML` property changes e.g. via Hive in controls.
+     *
+     * !!! Important !!!
+     *
+     * This is **not** meant to be used for manipulating the rendered content of the control besides simple,
+     * non-structural/-behavioral changes like adding CSS classes or data attributes etc.
+     *
+     * For manipulating/controlling the rendered content, use the {@link renderFn} instead.
+     *
+     * See {@link renderFn} for more differences between the two.
+     */
+    onRendered(callback: OnRenderedCallback<HTMLDivElement>): CallbackUnsubscribeOption;
     getElement(): HTMLElement | undefined;
     setVisible(visible: boolean): Promise<void>;
 }
 
+/**
+ * @param element The root element of the control into which you can render your custom content.
+ * @param rawHtml The raw HTML string which is set in the `HTML` property of the control.
+ */
 declare type CustomCtrlRenderFn = (element: HTMLDivElement, rawHtml: string | undefined) => void | Promise<void>;
 
 export declare class Dataview {
@@ -191,6 +292,14 @@ export declare const fireAnalyticsEvent: (event: string, eventData?: object | st
 
 export declare type FlexShopFinishJson = Shopware6FinishJson;
 
+/**
+ * Returns the resolved 3D asset paths (babylon.js assets, material packs, texture image assets)
+ * for all pre-packed asset bundles configured for this Configurator.
+ *
+ * The result is fetched once and cached — subsequent calls resolve immediately from cache.
+ */
+export declare const getAssetPaths: () => Promise<SdkAssetPaths>;
+
 /**
  * Retrieve the parent page's URI.
  *
@@ -219,6 +328,13 @@ declare type JsonObject = {
 
 declare type JsonPrimitive = string | number | boolean | null;
 
+/**
+ * Raw material JSON which can be passed to Babylon.js e.g. via `Material.Parse(material)`
+ */
+declare type MaterialAsset = z.infer<typeof ZMaterialAsset>;
+
+declare type MaterialPackName = z.infer<typeof ZMaterialPackName>;
+
 /**
  * Navigates to the login page of the Configurator.
  *
@@ -353,6 +469,20 @@ export declare type ProductCustomFields = {
  */
 export declare const redirectParentPage: (url: string) => Promise<ParentPageComResult<void>>;
 
+declare type SdkAssetPaths = {
+    babylonJsAssets: {
+        [key: AssetName]: Url;
+    };
+    materialPacks: {
+        [key: MaterialPackName]: {
+            [key: AssetName]: MaterialAsset;
+        };
+    };
+    textureImageAssets: {
+        [key: AssetName]: Url;
+    };
+};
+
 /**
  * Send a custom message to the parent page via the "CustomMessage".\
  * The parent page can handle those messages by implementing the function `Combeenation.on{msgName}`.
@@ -503,6 +633,13 @@ export declare type Shopware6FinishJson = {
     }[];
 };
 
+/**
+ * A simple key-value store where key = component name and value = current component value.
+ */
+declare type SyncCmpValuesStore<TCmps extends Record<CmpName, ValueComponent>> = {
+    [K in keyof TCmps & CmpName]: TCmps[K] extends ValueComponent<any, infer TValue, any> ? TValue | undefined : never;
+};
+
 declare class Text_2 {
     #private;
     readonly id: CtrlId;
@@ -513,6 +650,8 @@ declare class Text_2 {
 }
 export { Text_2 as Text }
 
+declare type Url = z.infer<typeof ZUrl>;
+
 /**
  * Represents a component of type `Value`
  */
@@ -542,8 +681,33 @@ export declare class ValueComponent<TName extends CmpName = CmpName, TValue exte
 
 export declare const version: string;
 
+declare const ZAssetName: z.ZodString;
+
 declare const ZCmpValue: z.ZodUnion<[z.ZodUnion<[z.ZodString, z.ZodNumber, z.ZodBoolean]>, z.ZodArray<z.ZodUnion<[z.ZodString, z.ZodNumber, z.ZodBoolean]>, "many">, z.ZodObject<{}, "strip", z.ZodTypeAny, {}, {}>, z.ZodUnknown]>;
 
 declare const ZCtrlId: z.ZodString;
 
+/**
+ * Raw material JSON which can be passed to Babylon.js e.g. via `Material.Parse(material)`
+ *
+ * Whilst this is not a full zod schema for Babylon material definitions, we least check for the presence of some
+ * required properties like `name` and `id` to avoid passing obviously invalid material definitions.
+ *
+ * Could be extended as needed.
+ */
+declare const ZMaterialAsset: z.ZodObject<{
+    name: z.ZodString;
+    id: z.ZodString;
+}, "passthrough", z.ZodTypeAny, z.objectOutputType<{
+    name: z.ZodString;
+    id: z.ZodString;
+}, z.ZodTypeAny, "passthrough">, z.objectInputType<{
+    name: z.ZodString;
+    id: z.ZodString;
+}, z.ZodTypeAny, "passthrough">>;
+
+declare const ZMaterialPackName: z.ZodString;
+
+declare const ZUrl: z.ZodBranded<z.ZodString, "Url">;
+
 export { }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@combeenation/custom-code-sdk",
-  "version": "0.0.1-alpha7",
+  "version": "0.0.1-alpha8",
   "description": "Combeenation custom code SDK package",
   "keywords": [],
   "homepage": "",