@saasbase-io/core-elements 1.1.0 → 1.1.1

package/dist/index.js

@@ -6460,7 +6460,7 @@ body {
           ${this._wrapSubmitButtons(ni(this,this.renderSpec.root_container,this.theme))}
         </div>
       </form>
-    `}async _onSubmit(t,s){t.preventDefault();const o=t.submitter;if(!o||!s||o.id!==s)return;const r=this._findButtonById(s);r&&await this.handleEvent(r.properties.event,r)}_findButtonById(t){const s=o=>{if(o.element_type==="button"&&o.id===t)return o;if(o.element_type==="container")for(const r of o.properties.children){const n=s(r);if(n)return n}return null};return this.renderSpec?s(this.renderSpec.root_container):null}animateHeight(){var d,u;const s=(((u=(d=this.customizations)==null?void 0:d.config)==null?void 0:u.breakpoints)??Q).sm,o=s?parseInt(s.toString().replace(/\D/g,""),10):640;if(window.innerWidth<=o)return;const n=this.renderRoot.querySelector("#root-container");if(!n)return;const i=n.scrollHeight;if(this.prevHeight===0){this.prevHeight=i,n.style.height="auto";return}if(i===this.prevHeight||this.isAnimating)return;const a=Math.abs(i-this.prevHeight);this.isAnimating=!0,this.resizeRAF&&cancelAnimationFrame(this.resizeRAF),this.resizeRAF=requestAnimationFrame(()=>{const m=Math.min(600,Math.max(200,a*1));n.style.transition="none",n.style.height=this.prevHeight+"px",n.offsetHeight,n.style.transition=`height ${m}ms ease`,n.style.height=i+"px";const f=()=>{n.style.transition="",n.style.height="auto",this.prevHeight=n.scrollHeight,this.isAnimating=!1};let y=!1;const w=()=>{y||(y=!0,f())};n.addEventListener("transitionend",w,{once:!0}),setTimeout(w,m)})}collectDataKeys(t){const s={},o=r=>{if(r&&((r.element_type==="input"||r.element_type==="checkbox"||r.element_type==="otp")&&r.data_key&&!r.hidden&&(s[r.data_key]=""),r.element_type==="container"))for(const n of r.properties.children)o(n)};return o(t),s}handleInputChange(t,s){s!==void 0&&(this.formData={...this.formData,[t]:s},xo(this,t,"change"),this.requestUpdate())}handleBlur(t){xo(this,t,"blur"),this.requestUpdate()}handleFocus(t,s){var n;(n=this.errors[t])!=null&&n.length&&(this.errors={...this.errors,[t]:[]});const o=`${s}-error`,r=document.getElementById(o);r&&r.parentNode&&r.parentNode.removeChild(r)}async handleEvent(t,s){var o,r;if(s.element_type==="html")try{await Ft.processLoginflowEvent({event:t,data:{}})}finally{this.eventEmitting=!1}else if(s.element_type==="otp")try{await Ft.processLoginflowEvent({event:t,data:this.formData})}finally{this.eventEmitting=!1}else if((o=s.properties.requires_valid)==null||o.forEach(i=>{xo(this,i,"submit"),this.requestUpdate()}),!(((r=s.properties.requires_valid)==null?void 0:r.some(i=>{var a,d;return((d=(a=this.errors)==null?void 0:a[i])==null?void 0:d.length)>0}))??!1)){this.loadingButtons={...this.loadingButtons,[s.id]:!0},this.eventEmitting=!0;try{await Ft.processLoginflowEvent({event:t,data:this.formData})}finally{this.loadingButtons={...this.loadingButtons,[s.id]:!1},this.eventEmitting=!1}}}findElementByKey(t){const s=o=>{if((o.element_type==="input"||o.element_type==="checkbox"||o.element_type==="otp")&&o.data_key===t)return o;if(o.element_type==="container")for(const r of o.properties.children){const n=s(r);if(n)return n}return null};return this.renderSpec?s(this.renderSpec.root_container):null}isFieldValid(t){const s=this.findElementByKey(t);if(!s||!("validation"in s.properties))return!0;const{validation:o}=s.properties,{data_key:r}=s;if(!o||!r)return!0;const n=this.formData[r];return o.rules.every(a=>this.validateRule(a,n))}validateRule(t,s){switch(t.type){case"required":return Jl(s);case"min_length":return Ql(s,t.length);case"max_length":return tc(s,t.length);case"min_value":return ec(s,t.value);case"max_value":return rc(s,t.value);case"regex":return sc(s,t.regex);case"field_match":return oc(s,t.field_match?this.formData[t.field_match]:void 0);case"email":return nc(s);case"phone":return ic(s);case"date":return ac(s);default:return!0}}};me([l({type:Object})],exports.SaasBaseLayout.prototype,"renderSpec",2);me([l({type:Object})],exports.SaasBaseLayout.prototype,"customizations",2);me([E()],exports.SaasBaseLayout.prototype,"formData",2);me([E()],exports.SaasBaseLayout.prototype,"errors",2);me([E()],exports.SaasBaseLayout.prototype,"loadingButtons",2);me([E()],exports.SaasBaseLayout.prototype,"eventEmitting",2);me([E()],exports.SaasBaseLayout.prototype,"theme",2);exports.SaasBaseLayout=me([h("sb-layout")],exports.SaasBaseLayout);var yw=Object.defineProperty,ww=Object.getOwnPropertyDescriptor,Ze=(e,t,s,o)=>{for(var r=o>1?void 0:o?ww(t,s):t,n=e.length-1,i;n>=0;n--)(i=e[n])&&(r=(o?i(t,s,r):i(r))||r);return o&&r&&yw(t,s,r),r};exports.SbProvider=class extends ${constructor(){super(...arguments),this.customizations=null,this.providedCustomizations=this.customizations,this.env=null,this.auth={isAuthenticated:!1},this.renderSpec=null,this.autoRedirect=!0}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),Wv(),(async()=>{for(;!this.env||!this.env.domain;)await new Promise(s=>setTimeout(s,20));Ft.configure({domain:this.env.domain,clientId:this.env.clientId,clientSecret:this.env.clientSecret??"",locale:this.env.locale,signinUrl:this.env.signinUrl,signupUrl:this.env.signupUrl,onFlowStateChange:s=>{s.render_spec&&(this.renderSpec=s.render_spec)}}),this.refreshAuthState()})().catch(s=>console.error("Error initializing SbProvider:",s))}updated(t){var s;super.updated(t),t.has("customizations")&&(this.providedCustomizations=this.customizations),t.has("env")&&(s=this.env)!=null&&s.domain&&Ft.configure({domain:this.env.domain,clientId:this.env.clientId,clientSecret:this.env.clientSecret??"",locale:this.env.locale,signinUrl:this.env.signinUrl,signupUrl:this.env.signupUrl,onFlowStateChange:o=>{o.render_spec&&(this.renderSpec=o.render_spec)}}),t.has("auth")&&this.handleAuthStateChange()}handleAuthStateChange(){if(!this.autoRedirect||!this.auth.isAuthenticated||!this.env)return;const t=window.location.pathname;if([this.env.signinUrl,this.env.signupUrl].some(r=>t.includes(r))){const i=new URLSearchParams(window.location.search).get("redirect_url")||this.env.signinRedirectUrl||"/";window.location.href=i}}refreshAuthState(){this.auth={isAuthenticated:Ft.isAuthenticated()}}};Ze([l({type:Object})],exports.SbProvider.prototype,"customizations",2);Ze([pe({context:qs})],exports.SbProvider.prototype,"providedCustomizations",2);Ze([l({type:Object}),pe({context:lc})],exports.SbProvider.prototype,"env",2);Ze([E(),pe({context:Bs})],exports.SbProvider.prototype,"auth",2);Ze([E(),pe({context:Hn})],exports.SbProvider.prototype,"renderSpec",2);Ze([l({type:Boolean})],exports.SbProvider.prototype,"autoRedirect",2);exports.SbProvider=Ze([h("sb-provider")],exports.SbProvider);var xw=Object.defineProperty,_w=Object.getOwnPropertyDescriptor,yc=(e,t,s,o)=>{for(var r=o>1?void 0:o?_w(t,s):t,n=e.length-1,i;n>=0;n--)(i=e[n])&&(r=(o?i(t,s,r):i(r))||r);return o&&r&&xw(t,s,r),r};exports.SignedOut=class extends ${constructor(){super(...arguments),this._cachedChildren=[]}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this._cachedChildren.length===0&&(this._cachedChildren=Array.from(this.childNodes),this._cachedChildren.forEach(t=>this.removeChild(t)))}render(){return this.auth?c`
+    `}async _onSubmit(t,s){t.preventDefault();const o=t.submitter;if(!o||!s||this.loadingButtons[s]||o.id!==s)return;const r=this._findButtonById(s);r&&await this.handleEvent(r.properties.event,r)}_findButtonById(t){const s=o=>{if(o.element_type==="button"&&o.id===t)return o;if(o.element_type==="container")for(const r of o.properties.children){const n=s(r);if(n)return n}return null};return this.renderSpec?s(this.renderSpec.root_container):null}animateHeight(){var d,u;const s=(((u=(d=this.customizations)==null?void 0:d.config)==null?void 0:u.breakpoints)??Q).sm,o=s?parseInt(s.toString().replace(/\D/g,""),10):640;if(window.innerWidth<=o)return;const n=this.renderRoot.querySelector("#root-container");if(!n)return;const i=n.scrollHeight;if(this.prevHeight===0){this.prevHeight=i,n.style.height="auto";return}if(i===this.prevHeight||this.isAnimating)return;const a=Math.abs(i-this.prevHeight);this.isAnimating=!0,this.resizeRAF&&cancelAnimationFrame(this.resizeRAF),this.resizeRAF=requestAnimationFrame(()=>{const m=Math.min(600,Math.max(200,a*1));n.style.transition="none",n.style.height=this.prevHeight+"px",n.offsetHeight,n.style.transition=`height ${m}ms ease`,n.style.height=i+"px";const f=()=>{n.style.transition="",n.style.height="auto",this.prevHeight=n.scrollHeight,this.isAnimating=!1};let y=!1;const w=()=>{y||(y=!0,f())};n.addEventListener("transitionend",w,{once:!0}),setTimeout(w,m)})}collectDataKeys(t){const s={},o=r=>{if(r&&((r.element_type==="input"||r.element_type==="checkbox"||r.element_type==="otp")&&r.data_key&&!r.hidden&&(s[r.data_key]=""),r.element_type==="container"))for(const n of r.properties.children)o(n)};return o(t),s}handleInputChange(t,s){s!==void 0&&(this.formData={...this.formData,[t]:s},xo(this,t,"change"),this.requestUpdate())}handleBlur(t){xo(this,t,"blur"),this.requestUpdate()}handleFocus(t,s){var n;(n=this.errors[t])!=null&&n.length&&(this.errors={...this.errors,[t]:[]});const o=`${s}-error`,r=document.getElementById(o);r&&r.parentNode&&r.parentNode.removeChild(r)}async handleEvent(t,s){var o,r;if(s.element_type==="html")try{await Ft.processLoginflowEvent({event:t,data:{}})}finally{this.eventEmitting=!1}else if(s.element_type==="otp")try{await Ft.processLoginflowEvent({event:t,data:this.formData})}finally{this.eventEmitting=!1}else{if(this.loadingButtons[s.id])return;if((o=s.properties.requires_valid)==null||o.forEach(i=>{xo(this,i,"submit"),this.requestUpdate()}),!(((r=s.properties.requires_valid)==null?void 0:r.some(i=>{var a,d;return((d=(a=this.errors)==null?void 0:a[i])==null?void 0:d.length)>0}))??!1)){this.loadingButtons={...this.loadingButtons,[s.id]:!0},this.eventEmitting=!0;try{await Ft.processLoginflowEvent({event:t,data:this.formData})}finally{this.loadingButtons={...this.loadingButtons,[s.id]:!1},this.eventEmitting=!1}}}}findElementByKey(t){const s=o=>{if((o.element_type==="input"||o.element_type==="checkbox"||o.element_type==="otp")&&o.data_key===t)return o;if(o.element_type==="container")for(const r of o.properties.children){const n=s(r);if(n)return n}return null};return this.renderSpec?s(this.renderSpec.root_container):null}isFieldValid(t){const s=this.findElementByKey(t);if(!s||!("validation"in s.properties))return!0;const{validation:o}=s.properties,{data_key:r}=s;if(!o||!r)return!0;const n=this.formData[r];return o.rules.every(a=>this.validateRule(a,n))}validateRule(t,s){switch(t.type){case"required":return Jl(s);case"min_length":return Ql(s,t.length);case"max_length":return tc(s,t.length);case"min_value":return ec(s,t.value);case"max_value":return rc(s,t.value);case"regex":return sc(s,t.regex);case"field_match":return oc(s,t.field_match?this.formData[t.field_match]:void 0);case"email":return nc(s);case"phone":return ic(s);case"date":return ac(s);default:return!0}}};me([l({type:Object})],exports.SaasBaseLayout.prototype,"renderSpec",2);me([l({type:Object})],exports.SaasBaseLayout.prototype,"customizations",2);me([E()],exports.SaasBaseLayout.prototype,"formData",2);me([E()],exports.SaasBaseLayout.prototype,"errors",2);me([E()],exports.SaasBaseLayout.prototype,"loadingButtons",2);me([E()],exports.SaasBaseLayout.prototype,"eventEmitting",2);me([E()],exports.SaasBaseLayout.prototype,"theme",2);exports.SaasBaseLayout=me([h("sb-layout")],exports.SaasBaseLayout);var yw=Object.defineProperty,ww=Object.getOwnPropertyDescriptor,Ze=(e,t,s,o)=>{for(var r=o>1?void 0:o?ww(t,s):t,n=e.length-1,i;n>=0;n--)(i=e[n])&&(r=(o?i(t,s,r):i(r))||r);return o&&r&&yw(t,s,r),r};exports.SbProvider=class extends ${constructor(){super(...arguments),this.customizations=null,this.providedCustomizations=this.customizations,this.env=null,this.auth={isAuthenticated:!1},this.renderSpec=null,this.autoRedirect=!0}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),Wv(),(async()=>{for(;!this.env||!this.env.domain;)await new Promise(s=>setTimeout(s,20));Ft.configure({domain:this.env.domain,clientId:this.env.clientId,clientSecret:this.env.clientSecret??"",locale:this.env.locale,signinUrl:this.env.signinUrl,signupUrl:this.env.signupUrl,onFlowStateChange:s=>{s.render_spec&&(this.renderSpec=s.render_spec)}}),this.refreshAuthState()})().catch(s=>console.error("Error initializing SbProvider:",s))}updated(t){var s;super.updated(t),t.has("customizations")&&(this.providedCustomizations=this.customizations),t.has("env")&&(s=this.env)!=null&&s.domain&&Ft.configure({domain:this.env.domain,clientId:this.env.clientId,clientSecret:this.env.clientSecret??"",locale:this.env.locale,signinUrl:this.env.signinUrl,signupUrl:this.env.signupUrl,onFlowStateChange:o=>{o.render_spec&&(this.renderSpec=o.render_spec)}}),t.has("auth")&&this.handleAuthStateChange()}handleAuthStateChange(){if(!this.autoRedirect||!this.auth.isAuthenticated||!this.env)return;const t=window.location.pathname;if([this.env.signinUrl,this.env.signupUrl].some(r=>t.includes(r))){const i=new URLSearchParams(window.location.search).get("redirect_url")||this.env.signinRedirectUrl||"/";window.location.href=i}}refreshAuthState(){this.auth={isAuthenticated:Ft.isAuthenticated()}}};Ze([l({type:Object})],exports.SbProvider.prototype,"customizations",2);Ze([pe({context:qs})],exports.SbProvider.prototype,"providedCustomizations",2);Ze([l({type:Object}),pe({context:lc})],exports.SbProvider.prototype,"env",2);Ze([E(),pe({context:Bs})],exports.SbProvider.prototype,"auth",2);Ze([E(),pe({context:Hn})],exports.SbProvider.prototype,"renderSpec",2);Ze([l({type:Boolean})],exports.SbProvider.prototype,"autoRedirect",2);exports.SbProvider=Ze([h("sb-provider")],exports.SbProvider);var xw=Object.defineProperty,_w=Object.getOwnPropertyDescriptor,yc=(e,t,s,o)=>{for(var r=o>1?void 0:o?_w(t,s):t,n=e.length-1,i;n>=0;n--)(i=e[n])&&(r=(o?i(t,s,r):i(r))||r);return o&&r&&xw(t,s,r),r};exports.SignedOut=class extends ${constructor(){super(...arguments),this._cachedChildren=[]}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this._cachedChildren.length===0&&(this._cachedChildren=Array.from(this.childNodes),this._cachedChildren.forEach(t=>this.removeChild(t)))}render(){return this.auth?c`
       <div ?hidden=${this.auth.isAuthenticated}>${this._cachedChildren}</div>
     `:A}};yc([gt({context:Bs,subscribe:!0}),l({attribute:!1})],exports.SignedOut.prototype,"auth",2);exports.SignedOut=yc([h("sb-signed-out")],exports.SignedOut);var Cw=Object.defineProperty,Sw=Object.getOwnPropertyDescriptor,wc=(e,t,s,o)=>{for(var r=o>1?void 0:o?Sw(t,s):t,n=e.length-1,i;n>=0;n--)(i=e[n])&&(r=(o?i(t,s,r):i(r))||r);return o&&r&&Cw(t,s,r),r};exports.SignedIn=class extends ${constructor(){super(...arguments),this._cachedChildren=[]}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this._cachedChildren.length===0&&(this._cachedChildren=Array.from(this.childNodes),this._cachedChildren.forEach(t=>this.removeChild(t)))}render(){return this.auth?c`
       <div ?hidden=${!this.auth.isAuthenticated}>${this._cachedChildren}</div>