@descope/user-profile-widget 0.0.80 → 0.0.82

package/README.md

@@ -17,7 +17,8 @@ DESCOPE_THEME=      # "light" / "dark" / "os", default: "light"
 ### Example
 
 ```
-<script src="https://cdn.jsdelivr.net/npm/@descope/user-profile-widget/dist/index.js"></script>
+// replace x.x.x with the latest release of the widget: https://www.npmjs.com/package/@descope/user-profile-widget
+<script src="https://static.descope.com/npm/@descope/user-profile-widget@x.x.x/dist/index.js"></script>
 <descope-user-profile-widget
   base-url="<DESCOPE_BASE_URL>"
   project-id="<DESCOPE_PROJECT_ID>"
@@ -92,24 +93,8 @@ An abstraction layer that provides an API for components, and enables handling i
 
 The motivation to use drivers is to decouple the widget's code from the component's implementation, and therefore it's important to interact with components only using drivers (and not relying on component's implementation details).
 
-### UI Components
-
-Widget UI is composed of [`@descope/web-components-ui`](https://github.com/descope/web-components-ui), which is loaded during the widget init in runtime.
-
-For optimization, we load only the relevant components, defined on the widget screens DOM.
-
 ## Dev
 
 ### Use mock screens
 
 Since screen are fetched dynamically, when developing a new screen for the widget you will probably want to use mock templates. To do so, simply replace the call to `fetchWidgetPage` with a string which includes your HTML.
-
-### Use local components
-
-In some cases you want to make changes to components anf see how it affects the widget. To do so, you need to build [`web-components-ui`](https://github.com/descope/web-components-ui) and serve the `dist` folder from your machine (with `npx serve` or other util).
-
-Add the key `base.ui.components.url` to your localStorage and set its value to the URL of the served dist `umd/index.js` file.
-
-###
-
-Pay attention that _theme changes_ will not take affect until the components

package/dist/esm/index.js

@@ -1,6 +1,6 @@
 
       /**
-       * @descope/user-profile-widget v0.0.80
+       * @descope/user-profile-widget v0.0.82
        */
-      import{__awaiter as t,__classPrivateFieldGet as e,__classPrivateFieldSet as i}from"tslib";import{createSingletonMixin as s,compose as o,createTemplate as r,kebabCase as n,withMemCache as a}from"@descope/sdk-helpers";import d from"@descope/web-component";import{projectIdMixin as l,observeAttributesMixin as h,loggerMixin as c,baseUrlMixin as u,createStateManagementMixin as f,initLifecycleMixin as g,staticResourcesMixin as v,createValidateAttributesMixin as p,descopeUiMixin as w,initElementMixin as m,modalMixin as b,baseStaticUrlMixin as y,debuggerMixin as R,themeMixin as U}from"@descope/sdk-mixins";import{FlowDriver as S,AvatarDriver as W,UserAttributeDriver as k,UserAuthMethodDriver as M,ButtonDriver as j}from"@descope/sdk-component-drivers";import{createSelector as I}from"reselect";import{createAsyncThunk as C}from"@reduxjs/toolkit";import A from"@descope/web-js-sdk";import"@descope/core-js-sdk";const x=t=>t.me.data,O=I(x,(t=>t.picture)),q=I(x,(t=>t.email)),E=I(x,(t=>t.verifiedEmail)),P=I(x,(t=>t.name)),F=I(x,(t=>t.phone)),T=I(x,(t=>t.verifiedPhone)),L=I(x,(t=>t.webauthn));I(x,(t=>t.password));const N=t=>(...e)=>i=>{i.addCase(t.pending,((t,i)=>{e.forEach((({onPending:e})=>{null==e||e(t,i)}))})),i.addCase(t.fulfilled,((t,i)=>{e.forEach((({onFulfilled:e})=>{null==e||e(t,i)}))})),i.addCase(t.rejected,((t,i)=>{e.forEach((({onRejected:e})=>{null==e||e(t,i)}))}))},$=C("users/me",((t,{extra:{api:e}})=>e.user.me())),D=N($)({onFulfilled:(t,e)=>{t.me.data=e.payload}},(H=t=>t.me,{onFulfilled:t=>{H(t).loading=!1},onPending:t=>{H(t).loading=!0,H(t).error=null},onRejected:(t,e)=>{H(t).loading=!1,H(t).error=e.error}}));var H;const B={action:$,reducer:D},J=C("users/logout",((t,{extra:{api:e}})=>e.user.logout())),V={action:J,reducer:N(J)({})},z={me:{loading:!1,error:null,data:{}}},G={me:"/v1/auth/me"},K=()=>t(void 0,void 0,void 0,(function*(){return new Promise((t=>{t({loginIds:["user@company.com"],externalIds:["user@company.com"],userId:"user-1",name:"Test User",email:"user@company.com",roleNames:["Role"],phone:"+1-202-555-010",verifiedEmail:!0,verifiedPhone:!0,userTenants:[],status:"enabled",editable:!0,createdTime:(new Date).getTime(),customAttributes:{},familyName:"",givenName:"",middleName:"",picture:void 0,password:!0,SAML:!1,test:!1,TOTP:!1,webauthn:!0})}))})),Q=({httpClient:e,mock:i})=>({me:()=>t(void 0,void 0,void 0,(function*(){if(i)return K();const s=yield e.get(G.me);return yield(e=>t(void 0,void 0,void 0,(function*(){const t=yield e.text(),i=JSON.parse(t);if(!e.ok){const t=`${i.errorDescription}${i.errorMessage?`: ${i.errorMessage}`:""}`;throw Error(t||`${e.status} ${e.statusText}`)}e.json=()=>Promise.resolve(i),e.text=()=>Promise.resolve(t)})))(s),s.json()}))}),X=s((s=>{var r,n,a,d;const f=o(l,h,c,u)(s);return d=class extends f{constructor(){super(...arguments),r.add(this),n.set(this,void 0)}get widgetId(){return this.getAttribute("widget-id")}get mock(){return this.getAttribute("mock")}get api(){return e(this,n,"f")||e(this,r,"m",a).call(this),e(this,n,"f")}init(){const i=Object.create(null,{init:{get:()=>super.init}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.init)||void 0===s?void 0:s.call(this),this.observeAttributes(["project-id","base-url"],(()=>{e(this,n,"f")&&e(this,r,"m",a).call(this)}))}))}},n=new WeakMap,r=new WeakSet,a=function(){this.logger.debug("creating an sdk instance"),i(this,n,((e,i,s)=>{const o=A(Object.assign(Object.assign({},e),{persistTokens:!0,baseHeaders:{"x-descope-widget-type":"user-profile-widget","x-descope-widget-id":s,"x-descope-widget-version":"0.0.80"}}));return{user:Object.assign(Object.assign({},Q({httpClient:o.httpClient,mock:i})),{logout:i?()=>t(void 0,void 0,void 0,(function*(){})):o.logout})}})({projectId:this.projectId,baseUrl:this.baseUrl},"true"===this.mock,this.widgetId),"f")},d})),Y=s((t=>{const e=o(f({name:"widget",initialState:z,reducers:{},extraReducers:t=>{B.reducer(t),V.reducer(t)},asyncActions:{getMe:B.action,logout:V.action}}),g,c,X)(t);return class extends e{constructor(...t){super(...t),this.state=z,this.subscribe((t=>{this.logger.debug("State update:",t),this.state=t}))}}})),Z=s((e=>{const i=o(v,p({"widget-id":p.missingAttrValidator}))(e);return class extends i{get widgetId(){return this.getAttribute("widget-id")}fetchWidgetPage(e){return t(this,void 0,void 0,(function*(){return(yield this.fetchStaticResource(`user-profile-widget/${this.widgetId}/${e}`,"text")).body}))}}})),_=s((i=>{var s,n,a;return a=class extends(o(c,g,w,m,Z,Y)(i)){constructor(){super(...arguments),s.add(this)}onWidgetRootReady(){return t(this,void 0,void 0,(function*(){}))}init(){const i=Object.create(null,{init:{get:()=>super.init}});var o;return t(this,void 0,void 0,(function*(){yield null===(o=i.init)||void 0===o?void 0:o.call(this),yield Promise.all([this.actions.getMe(),e(this,s,"m",n).call(this)]),this.onWidgetRootReady()}))}},s=new WeakSet,n=function(){return t(this,void 0,void 0,(function*(){const t=r(yield this.fetchWidgetPage("root.html"));yield this.loadDescopeUiComponents(t),this.contentRootElement.append(t.content.cloneNode(!0))}))},a})),tt=(t={})=>{const e=r("<descope-wc></descope-wc>");return Object.entries(t).forEach((([t,i])=>{e.content.querySelector("descope-wc").setAttribute(n(t),i)})),e};function et(t){return new URLSearchParams(window.location.search).get(t)}const it=s((s=>{var r,n,d,l,h,u,f,g,v;return v=class extends(o(Y,c,_,b,y)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),f.set(this,a((t=>{this.avatar.image=t}))),g.set(this,a((t=>{this.avatar.displayName=t})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",u).call(this),e(this,r,"m",l).call(this),e(this,f,"f").call(this,O(this.state)),e(this,g,"f").call(this,P(this.state)),this.subscribe(e(this,f,"f").bind(this),O),this.subscribe(e(this,g,"f").bind(this),P)}))}},n=new WeakMap,d=new WeakMap,f=new WeakMap,g=new WeakMap,r=new WeakSet,l=function(){i(this,n,this.createModal({"data-id":"update-pic"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",h).bind(this),e(this,r,"m",h).call(this)},h=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.avatar.flowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},u=function(){this.avatar=new W((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("descope-avatar")}),{logger:this.logger}),this.avatar.onClick((()=>{e(this,n,"f").open()}))},v})),st=s((s=>{var r,n,d,l,h,u,f,g,v,p,w,m,y;return y=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),l.set(this,void 0),h.set(this,void 0),w.set(this,a((t=>{this.emailUserAttr.value=t}))),m.set(this,a((t=>{this.emailUserAttr.badgeLabel=t?"":"Unverified"})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",p).call(this),e(this,r,"m",u).call(this),e(this,r,"m",g).call(this),e(this,w,"f").call(this,q(this.state)),e(this,m,"f").call(this,E(this.state)),this.subscribe(e(this,w,"f").bind(this),q),this.subscribe(e(this,m,"f").bind(this),E)}))}},n=new WeakMap,d=new WeakMap,l=new WeakMap,h=new WeakMap,w=new WeakMap,m=new WeakMap,r=new WeakSet,u=function(){i(this,n,this.createModal({"data-id":"edit-email"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",f).bind(this),e(this,r,"m",f).call(this)},f=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.emailUserAttr.editFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},g=function(){i(this,l,this.createModal({"data-id":"delete-email"}),"f"),i(this,h,new S((()=>{var t;return null===(t=e(this,l,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,l,"f").afterClose=e(this,r,"m",v).bind(this),e(this,r,"m",v).call(this)},v=function(){e(this,l,"f").setContent(tt({projectId:this.projectId,flowId:this.emailUserAttr.deleteFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,h,"f").onSuccess((()=>{e(this,l,"f").close(),this.actions.getMe()}))},p=function(){this.emailUserAttr=new k((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-attribute[data-id="email"]')}),{logger:this.logger}),this.emailUserAttr.onEditClick((()=>{e(this,n,"f").open()})),this.emailUserAttr.onDeleteClick((()=>{e(this,l,"f").open()}))},y})),ot=s((s=>{var r,n,d,l,h,u,f,g,v,p,w,m;return m=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),l.set(this,void 0),h.set(this,void 0),w.set(this,a((t=>{this.nameUserAttr.value=t})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",p).call(this),e(this,r,"m",u).call(this),e(this,r,"m",g).call(this),e(this,w,"f").call(this,P(this.state)),this.subscribe(e(this,w,"f").bind(this),P)}))}},n=new WeakMap,d=new WeakMap,l=new WeakMap,h=new WeakMap,w=new WeakMap,r=new WeakSet,u=function(){i(this,n,this.createModal({"data-id":"edit-name"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",f).bind(this),e(this,r,"m",f).call(this)},f=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.nameUserAttr.editFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},g=function(){i(this,l,this.createModal({"data-id":"delete-name"}),"f"),i(this,h,new S((()=>{var t;return null===(t=e(this,l,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,l,"f").afterClose=e(this,r,"m",v).bind(this),e(this,r,"m",v).call(this)},v=function(){e(this,l,"f").setContent(tt({projectId:this.projectId,flowId:this.nameUserAttr.deleteFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,h,"f").onSuccess((()=>{e(this,l,"f").close(),this.actions.getMe()}))},p=function(){this.nameUserAttr=new k((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-attribute[data-id="name"]')}),{logger:this.logger}),this.nameUserAttr.onEditClick((()=>{e(this,n,"f").open()})),this.nameUserAttr.onDeleteClick((()=>{e(this,l,"f").open()}))},m})),rt=s((s=>{var r,n,d,l,h,u,f,g,v,p,w,m,y;return y=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),l.set(this,void 0),h.set(this,void 0),w.set(this,a((t=>{this.phoneUserAttr.value=t}))),m.set(this,a((t=>{this.phoneUserAttr.badgeLabel=t?"":"Unverified"})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",p).call(this),e(this,r,"m",u).call(this),e(this,r,"m",g).call(this),e(this,w,"f").call(this,F(this.state)),e(this,m,"f").call(this,T(this.state)),this.subscribe(e(this,w,"f").bind(this),F),this.subscribe(e(this,m,"f").bind(this),T)}))}},n=new WeakMap,d=new WeakMap,l=new WeakMap,h=new WeakMap,w=new WeakMap,m=new WeakMap,r=new WeakSet,u=function(){i(this,n,this.createModal({"data-id":"edit-phone"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",f).bind(this),e(this,r,"m",f).call(this)},f=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.phoneUserAttr.editFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},g=function(){i(this,l,this.createModal({"data-id":"delete-phone"}),"f"),i(this,h,new S((()=>{var t;return null===(t=e(this,l,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,l,"f").afterClose=e(this,r,"m",v).bind(this),e(this,r,"m",v).call(this)},v=function(){e(this,l,"f").setContent(tt({projectId:this.projectId,flowId:this.phoneUserAttr.deleteFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,h,"f").onSuccess((()=>{e(this,l,"f").close(),this.actions.getMe()}))},p=function(){this.phoneUserAttr=new k((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-attribute[data-id="phone"]')}),{logger:this.logger}),this.phoneUserAttr.onEditClick((()=>{e(this,n,"f").open()})),this.phoneUserAttr.onDeleteClick((()=>{e(this,l,"f").open()}))},y})),nt=s((s=>{var r,n,d,l,h,u,f,g;return g=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),f.set(this,a((t=>{this.passkeyUserAuthMethod.fulfilled=t})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",u).call(this),e(this,r,"m",l).call(this),e(this,f,"f").call(this,L(this.state)),this.subscribe(e(this,f,"f").bind(this),L)}))}},n=new WeakMap,d=new WeakMap,f=new WeakMap,r=new WeakSet,l=function(){i(this,n,this.createModal({"data-id":"passkey"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",h).bind(this),e(this,r,"m",h).call(this)},h=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.passkeyUserAuthMethod.flowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},u=function(){this.passkeyUserAuthMethod=new M((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-auth-method[data-id="passkey"]')}),{logger:this.logger}),this.passkeyUserAuthMethod.onButtonClick((()=>{e(this,n,"f").open()}))},g})),at=s((s=>{var r,n,a,d,l,h,u;return u=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),a.set(this,void 0)}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",h).call(this),e(this,r,"m",d).call(this)}))}},n=new WeakMap,a=new WeakMap,r=new WeakSet,d=function(){i(this,n,this.createModal({"data-id":"password"}),"f"),i(this,a,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",l).bind(this),e(this,r,"m",l).call(this)},l=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.passwordUserAuthMethod.flowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,a,"f").onSuccess((()=>{e(this,n,"f").close()}))},h=function(){this.passwordUserAuthMethod=new M((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-auth-method[data-id="password"]')}),{logger:this.logger}),this.passwordUserAuthMethod.onButtonClick((()=>{e(this,n,"f").open()}))},u})),dt=s((i=>{var s,r,n;return n=class extends(o(Y,c,_,b)(i)){constructor(){super(...arguments),s.add(this)}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var o;return t(this,void 0,void 0,(function*(){yield null===(o=i.onWidgetRootReady)||void 0===o?void 0:o.call(this),e(this,s,"m",r).call(this)}))}},s=new WeakSet,r=function(){this.logout=new j((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-button[data-id="logout"]')}),{logger:this.logger}),this.logout.onClick((()=>t(this,void 0,void 0,(function*(){yield this.actions.logout(),this.dispatchEvent(new CustomEvent("logout"))}))))},n})),lt="widget-flow",ht=s((i=>{var s,r,n;return n=class extends(o(g,b,Y,c)(i)){constructor(){super(...arguments),s.add(this)}init(){const i=Object.create(null,{init:{get:()=>super.init}});var o;return t(this,void 0,void 0,(function*(){yield null===(o=i.init)||void 0===o?void 0:o.call(this);const t=et(lt);t&&(!function(t){if(window.history.replaceState&&et(t)){const e=new URL(window.location.href),i=new URLSearchParams(e.search);i.delete(t),e.search=i.toString(),window.history.replaceState({},"",e.toString())}}(lt),e(this,s,"m",r).call(this,t))}))}},s=new WeakSet,r=function(t){const e=this.createModal({"data-id":"redirect-flow"});e.setContent(tt({projectId:this.projectId,flowId:t,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl}));const i=new S((()=>{var t;return null===(t=e.ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger});i.onSuccess((()=>{e.close(),this.actions.getMe()})),e.afterClose=()=>{e.remove()},e.open()},n})),ct=s((e=>class extends(o(R,U,ht,st,it,ot,rt,nt,at,dt)(e)){init(){const e=Object.create(null,{init:{get:()=>super.init}});var i;return t(this,void 0,void 0,(function*(){yield null===(i=e.init)||void 0===i?void 0:i.call(this)}))}})),ut=o((e=>class extends(ct(e)){init(){const e=Object.create(null,{init:{get:()=>super.init}});var i;return t(this,void 0,void 0,(function*(){yield null===(i=e.init)||void 0===i?void 0:i.call(this),d.sdkConfigOverrides={baseHeaders:{"x-descope-widget-type":"user-profile-widget","x-descope-widget-id":this.getAttribute("widget-id"),"x-descope-widget-version":"0.0.80"}}}))}}))(HTMLElement);customElements.define("descope-user-profile-widget",ut);export{ut as default};
+      import{__awaiter as t,__classPrivateFieldGet as e,__classPrivateFieldSet as i}from"tslib";import{createSingletonMixin as s,compose as o,createTemplate as r,kebabCase as n,withMemCache as a}from"@descope/sdk-helpers";import d from"@descope/web-component";import{projectIdMixin as l,observeAttributesMixin as h,loggerMixin as c,baseUrlMixin as u,createStateManagementMixin as f,initLifecycleMixin as g,staticResourcesMixin as v,createValidateAttributesMixin as p,descopeUiMixin as w,initElementMixin as m,modalMixin as b,baseStaticUrlMixin as y,debuggerMixin as R,themeMixin as U}from"@descope/sdk-mixins";import{FlowDriver as S,AvatarDriver as W,UserAttributeDriver as k,UserAuthMethodDriver as M,ButtonDriver as j}from"@descope/sdk-component-drivers";import{createSelector as I}from"reselect";import{createAsyncThunk as C}from"@reduxjs/toolkit";import A from"@descope/web-js-sdk";import"@descope/core-js-sdk";const x=t=>t.me.data,O=I(x,(t=>t.picture)),q=I(x,(t=>t.email)),E=I(x,(t=>t.verifiedEmail)),P=I(x,(t=>t.name)),F=I(x,(t=>t.phone)),T=I(x,(t=>t.verifiedPhone)),L=I(x,(t=>t.webauthn));I(x,(t=>t.password));const N=t=>(...e)=>i=>{i.addCase(t.pending,((t,i)=>{e.forEach((({onPending:e})=>{null==e||e(t,i)}))})),i.addCase(t.fulfilled,((t,i)=>{e.forEach((({onFulfilled:e})=>{null==e||e(t,i)}))})),i.addCase(t.rejected,((t,i)=>{e.forEach((({onRejected:e})=>{null==e||e(t,i)}))}))},$=C("users/me",((t,{extra:{api:e}})=>e.user.me())),D=N($)({onFulfilled:(t,e)=>{t.me.data=e.payload}},(H=t=>t.me,{onFulfilled:t=>{H(t).loading=!1},onPending:t=>{H(t).loading=!0,H(t).error=null},onRejected:(t,e)=>{H(t).loading=!1,H(t).error=e.error}}));var H;const B={action:$,reducer:D},J=C("users/logout",((t,{extra:{api:e}})=>e.user.logout())),V={action:J,reducer:N(J)({})},z={me:{loading:!1,error:null,data:{}}},G={me:"/v1/auth/me"},K=()=>t(void 0,void 0,void 0,(function*(){return new Promise((t=>{t({loginIds:["user@company.com"],externalIds:["user@company.com"],userId:"user-1",name:"Test User",email:"user@company.com",roleNames:["Role"],phone:"+1-202-555-010",verifiedEmail:!0,verifiedPhone:!0,userTenants:[],status:"enabled",editable:!0,createdTime:(new Date).getTime(),customAttributes:{},familyName:"",givenName:"",middleName:"",picture:void 0,password:!0,SAML:!1,test:!1,TOTP:!1,webauthn:!0})}))})),Q=({httpClient:e,mock:i})=>({me:()=>t(void 0,void 0,void 0,(function*(){if(i)return K();const s=yield e.get(G.me);return yield(e=>t(void 0,void 0,void 0,(function*(){const t=yield e.text(),i=JSON.parse(t);if(!e.ok){const t=`${i.errorDescription}${i.errorMessage?`: ${i.errorMessage}`:""}`;throw Error(t||`${e.status} ${e.statusText}`)}e.json=()=>Promise.resolve(i),e.text=()=>Promise.resolve(t)})))(s),s.json()}))}),X=s((s=>{var r,n,a,d;const f=o(l,h,c,u)(s);return d=class extends f{constructor(){super(...arguments),r.add(this),n.set(this,void 0)}get widgetId(){return this.getAttribute("widget-id")}get mock(){return this.getAttribute("mock")}get api(){return e(this,n,"f")||e(this,r,"m",a).call(this),e(this,n,"f")}init(){const i=Object.create(null,{init:{get:()=>super.init}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.init)||void 0===s?void 0:s.call(this),this.observeAttributes(["project-id","base-url"],(()=>{e(this,n,"f")&&e(this,r,"m",a).call(this)}))}))}},n=new WeakMap,r=new WeakSet,a=function(){this.logger.debug("creating an sdk instance"),i(this,n,((e,i,s)=>{const o=A(Object.assign(Object.assign({},e),{persistTokens:!0,baseHeaders:{"x-descope-widget-type":"user-profile-widget","x-descope-widget-id":s,"x-descope-widget-version":"0.0.82"}}));return{user:Object.assign(Object.assign({},Q({httpClient:o.httpClient,mock:i})),{logout:i?()=>t(void 0,void 0,void 0,(function*(){})):o.logout})}})({projectId:this.projectId,baseUrl:this.baseUrl},"true"===this.mock,this.widgetId),"f")},d})),Y=s((t=>{const e=o(f({name:"widget",initialState:z,reducers:{},extraReducers:t=>{B.reducer(t),V.reducer(t)},asyncActions:{getMe:B.action,logout:V.action}}),g,c,X)(t);return class extends e{constructor(...t){super(...t),this.state=z,this.subscribe((t=>{this.logger.debug("State update:",t),this.state=t}))}}})),Z=s((e=>{const i=o(v,p({"widget-id":p.missingAttrValidator}))(e);return class extends i{get widgetId(){return this.getAttribute("widget-id")}fetchWidgetPage(e){return t(this,void 0,void 0,(function*(){return(yield this.fetchStaticResource(`user-profile-widget/${this.widgetId}/${e}`,"text")).body}))}}})),_=s((i=>{var s,n,a;return a=class extends(o(c,g,w,m,Z,Y)(i)){constructor(){super(...arguments),s.add(this)}onWidgetRootReady(){return t(this,void 0,void 0,(function*(){}))}init(){const i=Object.create(null,{init:{get:()=>super.init}});var o;return t(this,void 0,void 0,(function*(){yield null===(o=i.init)||void 0===o?void 0:o.call(this),yield Promise.all([this.actions.getMe(),e(this,s,"m",n).call(this)]),this.onWidgetRootReady()}))}},s=new WeakSet,n=function(){return t(this,void 0,void 0,(function*(){const t=r(yield this.fetchWidgetPage("root.html"));yield this.loadDescopeUiComponents(t),this.contentRootElement.append(t.content.cloneNode(!0))}))},a})),tt=(t={})=>{const e=r("<descope-wc></descope-wc>");return Object.entries(t).forEach((([t,i])=>{e.content.querySelector("descope-wc").setAttribute(n(t),i)})),e};function et(t){return new URLSearchParams(window.location.search).get(t)}const it=s((s=>{var r,n,d,l,h,u,f,g,v;return v=class extends(o(Y,c,_,b,y)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),f.set(this,a((t=>{this.avatar.image=t}))),g.set(this,a((t=>{this.avatar.displayName=t})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",u).call(this),e(this,r,"m",l).call(this),e(this,f,"f").call(this,O(this.state)),e(this,g,"f").call(this,P(this.state)),this.subscribe(e(this,f,"f").bind(this),O),this.subscribe(e(this,g,"f").bind(this),P)}))}},n=new WeakMap,d=new WeakMap,f=new WeakMap,g=new WeakMap,r=new WeakSet,l=function(){i(this,n,this.createModal({"data-id":"update-pic"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",h).bind(this),e(this,r,"m",h).call(this)},h=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.avatar.flowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},u=function(){this.avatar=new W((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("descope-avatar")}),{logger:this.logger}),this.avatar.onClick((()=>{e(this,n,"f").open()}))},v})),st=s((s=>{var r,n,d,l,h,u,f,g,v,p,w,m,y;return y=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),l.set(this,void 0),h.set(this,void 0),w.set(this,a((t=>{this.emailUserAttr.value=t}))),m.set(this,a((t=>{this.emailUserAttr.badgeLabel=t?"":"Unverified"})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",p).call(this),e(this,r,"m",u).call(this),e(this,r,"m",g).call(this),e(this,w,"f").call(this,q(this.state)),e(this,m,"f").call(this,E(this.state)),this.subscribe(e(this,w,"f").bind(this),q),this.subscribe(e(this,m,"f").bind(this),E)}))}},n=new WeakMap,d=new WeakMap,l=new WeakMap,h=new WeakMap,w=new WeakMap,m=new WeakMap,r=new WeakSet,u=function(){i(this,n,this.createModal({"data-id":"edit-email"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",f).bind(this),e(this,r,"m",f).call(this)},f=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.emailUserAttr.editFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},g=function(){i(this,l,this.createModal({"data-id":"delete-email"}),"f"),i(this,h,new S((()=>{var t;return null===(t=e(this,l,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,l,"f").afterClose=e(this,r,"m",v).bind(this),e(this,r,"m",v).call(this)},v=function(){e(this,l,"f").setContent(tt({projectId:this.projectId,flowId:this.emailUserAttr.deleteFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,h,"f").onSuccess((()=>{e(this,l,"f").close(),this.actions.getMe()}))},p=function(){this.emailUserAttr=new k((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-attribute[data-id="email"]')}),{logger:this.logger}),this.emailUserAttr.onEditClick((()=>{e(this,n,"f").open()})),this.emailUserAttr.onDeleteClick((()=>{e(this,l,"f").open()}))},y})),ot=s((s=>{var r,n,d,l,h,u,f,g,v,p,w,m;return m=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),l.set(this,void 0),h.set(this,void 0),w.set(this,a((t=>{this.nameUserAttr.value=t})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",p).call(this),e(this,r,"m",u).call(this),e(this,r,"m",g).call(this),e(this,w,"f").call(this,P(this.state)),this.subscribe(e(this,w,"f").bind(this),P)}))}},n=new WeakMap,d=new WeakMap,l=new WeakMap,h=new WeakMap,w=new WeakMap,r=new WeakSet,u=function(){i(this,n,this.createModal({"data-id":"edit-name"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",f).bind(this),e(this,r,"m",f).call(this)},f=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.nameUserAttr.editFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},g=function(){i(this,l,this.createModal({"data-id":"delete-name"}),"f"),i(this,h,new S((()=>{var t;return null===(t=e(this,l,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,l,"f").afterClose=e(this,r,"m",v).bind(this),e(this,r,"m",v).call(this)},v=function(){e(this,l,"f").setContent(tt({projectId:this.projectId,flowId:this.nameUserAttr.deleteFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,h,"f").onSuccess((()=>{e(this,l,"f").close(),this.actions.getMe()}))},p=function(){this.nameUserAttr=new k((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-attribute[data-id="name"]')}),{logger:this.logger}),this.nameUserAttr.onEditClick((()=>{e(this,n,"f").open()})),this.nameUserAttr.onDeleteClick((()=>{e(this,l,"f").open()}))},m})),rt=s((s=>{var r,n,d,l,h,u,f,g,v,p,w,m,y;return y=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),l.set(this,void 0),h.set(this,void 0),w.set(this,a((t=>{this.phoneUserAttr.value=t}))),m.set(this,a((t=>{this.phoneUserAttr.badgeLabel=t?"":"Unverified"})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",p).call(this),e(this,r,"m",u).call(this),e(this,r,"m",g).call(this),e(this,w,"f").call(this,F(this.state)),e(this,m,"f").call(this,T(this.state)),this.subscribe(e(this,w,"f").bind(this),F),this.subscribe(e(this,m,"f").bind(this),T)}))}},n=new WeakMap,d=new WeakMap,l=new WeakMap,h=new WeakMap,w=new WeakMap,m=new WeakMap,r=new WeakSet,u=function(){i(this,n,this.createModal({"data-id":"edit-phone"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",f).bind(this),e(this,r,"m",f).call(this)},f=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.phoneUserAttr.editFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},g=function(){i(this,l,this.createModal({"data-id":"delete-phone"}),"f"),i(this,h,new S((()=>{var t;return null===(t=e(this,l,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,l,"f").afterClose=e(this,r,"m",v).bind(this),e(this,r,"m",v).call(this)},v=function(){e(this,l,"f").setContent(tt({projectId:this.projectId,flowId:this.phoneUserAttr.deleteFlowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,h,"f").onSuccess((()=>{e(this,l,"f").close(),this.actions.getMe()}))},p=function(){this.phoneUserAttr=new k((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-attribute[data-id="phone"]')}),{logger:this.logger}),this.phoneUserAttr.onEditClick((()=>{e(this,n,"f").open()})),this.phoneUserAttr.onDeleteClick((()=>{e(this,l,"f").open()}))},y})),nt=s((s=>{var r,n,d,l,h,u,f,g;return g=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),d.set(this,void 0),f.set(this,a((t=>{this.passkeyUserAuthMethod.fulfilled=t})))}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",u).call(this),e(this,r,"m",l).call(this),e(this,f,"f").call(this,L(this.state)),this.subscribe(e(this,f,"f").bind(this),L)}))}},n=new WeakMap,d=new WeakMap,f=new WeakMap,r=new WeakSet,l=function(){i(this,n,this.createModal({"data-id":"passkey"}),"f"),i(this,d,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",h).bind(this),e(this,r,"m",h).call(this)},h=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.passkeyUserAuthMethod.flowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,d,"f").onSuccess((()=>{e(this,n,"f").close(),this.actions.getMe()}))},u=function(){this.passkeyUserAuthMethod=new M((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-auth-method[data-id="passkey"]')}),{logger:this.logger}),this.passkeyUserAuthMethod.onButtonClick((()=>{e(this,n,"f").open()}))},g})),at=s((s=>{var r,n,a,d,l,h,u;return u=class extends(o(Y,c,_,b)(s)){constructor(){super(...arguments),r.add(this),n.set(this,void 0),a.set(this,void 0)}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return t(this,void 0,void 0,(function*(){yield null===(s=i.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,r,"m",h).call(this),e(this,r,"m",d).call(this)}))}},n=new WeakMap,a=new WeakMap,r=new WeakSet,d=function(){i(this,n,this.createModal({"data-id":"password"}),"f"),i(this,a,new S((()=>{var t;return null===(t=e(this,n,"f").ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger}),"f"),e(this,n,"f").afterClose=e(this,r,"m",l).bind(this),e(this,r,"m",l).call(this)},l=function(){e(this,n,"f").setContent(tt({projectId:this.projectId,flowId:this.passwordUserAuthMethod.flowId,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl})),e(this,a,"f").onSuccess((()=>{e(this,n,"f").close()}))},h=function(){this.passwordUserAuthMethod=new M((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-user-auth-method[data-id="password"]')}),{logger:this.logger}),this.passwordUserAuthMethod.onButtonClick((()=>{e(this,n,"f").open()}))},u})),dt=s((i=>{var s,r,n;return n=class extends(o(Y,c,_,b)(i)){constructor(){super(...arguments),s.add(this)}onWidgetRootReady(){const i=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var o;return t(this,void 0,void 0,(function*(){yield null===(o=i.onWidgetRootReady)||void 0===o?void 0:o.call(this),e(this,s,"m",r).call(this)}))}},s=new WeakSet,r=function(){this.logout=new j((()=>{var t;return null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('descope-button[data-id="logout"]')}),{logger:this.logger}),this.logout.onClick((()=>t(this,void 0,void 0,(function*(){yield this.actions.logout(),this.dispatchEvent(new CustomEvent("logout"))}))))},n})),lt="widget-flow",ht=s((i=>{var s,r,n;return n=class extends(o(g,b,Y,c)(i)){constructor(){super(...arguments),s.add(this)}init(){const i=Object.create(null,{init:{get:()=>super.init}});var o;return t(this,void 0,void 0,(function*(){yield null===(o=i.init)||void 0===o?void 0:o.call(this);const t=et(lt);t&&(!function(t){if(window.history.replaceState&&et(t)){const e=new URL(window.location.href),i=new URLSearchParams(e.search);i.delete(t),e.search=i.toString(),window.history.replaceState({},"",e.toString())}}(lt),e(this,s,"m",r).call(this,t))}))}},s=new WeakSet,r=function(t){const e=this.createModal({"data-id":"redirect-flow"});e.setContent(tt({projectId:this.projectId,flowId:t,baseUrl:this.baseUrl,baseStaticUrl:this.baseStaticUrl}));const i=new S((()=>{var t;return null===(t=e.ele)||void 0===t?void 0:t.querySelector("descope-wc")}),{logger:this.logger});i.onSuccess((()=>{e.close(),this.actions.getMe()})),e.afterClose=()=>{e.remove()},e.open()},n})),ct=s((e=>class extends(o(R,U,ht,st,it,ot,rt,nt,at,dt)(e)){init(){const e=Object.create(null,{init:{get:()=>super.init}});var i;return t(this,void 0,void 0,(function*(){yield null===(i=e.init)||void 0===i?void 0:i.call(this)}))}})),ut=o((e=>class extends(ct(e)){init(){const e=Object.create(null,{init:{get:()=>super.init}});var i;return t(this,void 0,void 0,(function*(){yield null===(i=e.init)||void 0===i?void 0:i.call(this),d.sdkConfigOverrides={baseHeaders:{"x-descope-widget-type":"user-profile-widget","x-descope-widget-id":this.getAttribute("widget-id"),"x-descope-widget-version":"0.0.82"}}}))}}))(HTMLElement);customElements.define("descope-user-profile-widget",ut);export{ut as default};
 //# sourceMappingURL=index.js.map