@descope/user-management-widget
Advanced tools
Comparing version 0.2.0 to 0.2.1
@@ -1,3 +0,3 @@ | ||
// @descope/user-management-widget v0.2.0 | ||
// @descope/user-management-widget v0.2.1 | ||
import{__classPrivateFieldGet as e,__classPrivateFieldSet as t}from"tslib";var n,s,i,o;function l(e,t){const n=Object.getOwnPropertyNames(e),s=Object.getOwnPropertyNames(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s+=1){const i=n[s],o=e[i],r=t[i];if(null===o||null===r){if(o!==r)return!1}else if("object"==typeof o&&"object"==typeof r){if(!l(o,r))return!1}else if(o!==r)return!1}return!0}class r{constructor(r={},{updateOnlyOnChange:a=!0}={}){n.set(this,void 0),s.set(this,{}),i.set(this,0),o.set(this,!1),this.update=i=>{const r="function"==typeof i?i(e(this,n,"f")):i,a=Object.assign(Object.assign({},e(this,n,"f")),r);if(!e(this,o,"f")||!l(e(this,n,"f"),a)){const i=e(this,n,"f");t(this,n,a,"f"),Object.freeze(e(this,n,"f")),setTimeout((()=>{Object.values(e(this,s,"f")).forEach((e=>e(a,i,((e,t)=>n=>e[n]!==t[n])(a,i))))}),0)}},t(this,n,r,"f"),t(this,o,a,"f")}get current(){return Object.assign({},e(this,n,"f"))}subscribe(n){return t(this,i,e(this,i,"f")+1,"f"),e(this,s,"f")[e(this,i,"f")]=n,e(this,i,"f").toString()}unsubscribe(t){const n=!!e(this,s,"f")[t];return n&&delete e(this,s,"f")[t],n}unsubscribeAll(){return t(this,s,{},"f"),!0}}n=new WeakMap,s=new WeakMap,i=new WeakMap,o=new WeakMap;const a=(e,t,n,s={})=>{var i,o,l,r;return[Math.min(Math.max(t,("all"===s.left?e.offsetWidth:null!==(i=s.left)&&void 0!==i?i:0)-e.offsetWidth),window.innerWidth-("all"===s.right?e.offsetWidth:null!==(o=s.right)&&void 0!==o?o:0)),Math.min(Math.max(n,("all"===s.top?e.offsetHeight:null!==(l=s.top)&&void 0!==l?l:0)-e.offsetHeight),window.innerHeight-("all"===s.bottom?e.offsetHeight:null!==(r=s.bottom)&&void 0!==r?r:0))]};var d,c,h,f,p,g,u,m,b,v;const x=document.createElement("template");x.innerHTML=`\n<style>\n .debugger {\n width: 300px;\n height: 200px;\n background-color: #FAFAFA;\n position: fixed;\n font-family: "Helvetica Neue", sans-serif;\n box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 10px;\n border-radius: 8px;\n overflow: hidden;\n border: 1px solid lightgrey;\n pointer-events: initial;\n display: flex;\n flex-direction: column;\n min-width: 200px;\n max-width: 600px;\n max-height: calc(100% - 64px);\n min-height: 200px;\n resize: both;\n }\n\n .header {\n padding: 8px 16px;\n display: flex;\n align-items: center;\n background-color: #EEEEEE;\n cursor: move;\n border-bottom: 1px solid #e0e0e0;\n }\n\n .content {\n font-size: 14px;\n flex-grow: 1;\n overflow: auto;\n }\n\n .msg {\n border-bottom: 1px solid lightgrey;\n padding: 8px 16px;\n display: flex;\n gap: 5px;\n background-color: #FAFAFA;\n }\n\n .msg.collapsible {\n cursor: pointer;\n }\n\n .empty-state {\n padding: 8px 16px;\n background-color: #FAFAFA;\n }\n\n\n .msg.collapsible:not(.collapsed) {\n background-color: #F5F5F5;\n }\n\n .msg_title {\n padding-bottom: 5px;\n display: flex;\n gap: 8px;\n font-weight: 500;\n }\n\n .msg svg {\n padding: 1px;\n flex-shrink: 0;\n margin-top: -2px;\n }\n\n .msg_content {\n overflow: hidden;\n flex-grow: 1;\n margin-right:5px;\n }\n\n .msg_desc {\n color: #646464;\n cursor: initial;\n word-wrap: break-word;\n }\n\n .msg.collapsed .msg_desc {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .msg.collapsible.collapsed .chevron {\n transform: rotate(-45deg) translateX(-2px);\n }\n\n .msg.collapsible .chevron {\n content: "";\n width:6px;\n height:6px;\n border-bottom: 2px solid grey;\n border-right: 2px solid grey;\n transform: rotate(45deg) translateX(-1px);\n margin: 5px;\n flex-shrink:0;\n }\n</style>\n\n<div style="top:32px; left:${window.innerWidth-300-32}px;" class="debugger">\n <div class="header">\n <span>Debugger messages</span>\n </div>\n <div class="content">\n <div class="empty-state">\n No errors detected 👀\n </div>\n </div>\n</div>\n`;class w extends HTMLElement{constructor(){var n;super(),d.add(this),c.set(this,new r({messages:[]})),h.set(this,void 0),f.set(this,void 0),p.set(this,void 0),g.set(this,{resize:e(this,d,"m",v).bind(this)}),this.attachShadow({mode:"open"}),null===(n=this.shadowRoot)||void 0===n||n.appendChild(x.content.cloneNode(!0)),t(this,h,this.shadowRoot.querySelector(".debugger"),"f"),t(this,f,e(this,h,"f").querySelector(".content"),"f"),t(this,p,e(this,h,"f").querySelector(".header"),"f")}updateData(t){e(this,c,"f").update((e=>({messages:e.messages.concat(t)})))}connectedCallback(){var t;((e,t,n)=>{let s=0,i=0,o=0,l=0;function r(t){t.preventDefault(),s=o-t.clientX,i=l-t.clientY,o=t.clientX,l=t.clientY;const[r,d]=a(e,e.offsetLeft-s,e.offsetTop-i,n);e.style.top=`${d}px`,e.style.left=`${r}px`}function d(){document.onmouseup=null,document.onmousemove=null}function c(e){e.preventDefault(),o=e.clientX,l=e.clientY,document.onmouseup=d,document.onmousemove=r}t?t.onmousedown=c:e.onmousedown=c})(e(this,h,"f"),e(this,p,"f"),{top:"all",bottom:100,left:100,right:100}),window.addEventListener("resize",e(this,g,"f").resize),(t=e(this,h,"f")).onmousemove=e=>{var n;const s=e.target;(s.w&&s.w!==s.offsetWidth||s.h&&s.h!==s.offsetHeight)&&(null===(n=t.onresize)||void 0===n||n.call(t,e)),s.w=s.offsetWidth,s.h=s.offsetHeight},e(this,h,"f").onresize=e(this,d,"m",b).bind(this),e(this,c,"f").subscribe(e(this,d,"m",u).bind(this))}disconnectedCallback(){e(this,c,"f").unsubscribeAll(),window.removeEventListener("resize",e(this,g,"f").resize)}}c=new WeakMap,h=new WeakMap,f=new WeakMap,p=new WeakMap,g=new WeakMap,d=new WeakSet,u=function(t){e(this,d,"m",m).call(this,t),e(this,d,"m",b).call(this)},m=function(t){e(this,f,"f").innerHTML=t.messages.map((e=>`\n <div class="msg">\n <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M5.99984 13.167L8.99984 10.167L11.9998 13.167L13.1665 12.0003L10.1665 9.00033L13.1665 6.00033L11.9998 4.83366L8.99984 7.83366L5.99984 4.83366L4.83317 6.00033L7.83317 9.00033L4.83317 12.0003L5.99984 13.167ZM8.99984 17.3337C7.84706 17.3337 6.76373 17.1148 5.74984 16.677C4.73595 16.2398 3.854 15.6462 3.104 14.8962C2.354 14.1462 1.76039 13.2642 1.32317 12.2503C0.885393 11.2364 0.666504 10.1531 0.666504 9.00033C0.666504 7.84755 0.885393 6.76421 1.32317 5.75033C1.76039 4.73644 2.354 3.85449 3.104 3.10449C3.854 2.35449 4.73595 1.7606 5.74984 1.32283C6.76373 0.885603 7.84706 0.666992 8.99984 0.666992C10.1526 0.666992 11.2359 0.885603 12.2498 1.32283C13.2637 1.7606 14.1457 2.35449 14.8957 3.10449C15.6457 3.85449 16.2393 4.73644 16.6765 5.75033C17.1143 6.76421 17.3332 7.84755 17.3332 9.00033C17.3332 10.1531 17.1143 11.2364 16.6765 12.2503C16.2393 13.2642 15.6457 14.1462 14.8957 14.8962C14.1457 15.6462 13.2637 16.2398 12.2498 16.677C11.2359 17.1148 10.1526 17.3337 8.99984 17.3337ZM8.99984 15.667C10.8609 15.667 12.4373 15.0212 13.729 13.7295C15.0207 12.4378 15.6665 10.8614 15.6665 9.00033C15.6665 7.13921 15.0207 5.56283 13.729 4.27116C12.4373 2.97949 10.8609 2.33366 8.99984 2.33366C7.13873 2.33366 5.56234 2.97949 4.27067 4.27116C2.979 5.56283 2.33317 7.13921 2.33317 9.00033C2.33317 10.8614 2.979 12.4378 4.27067 13.7295C5.56234 15.0212 7.13873 15.667 8.99984 15.667Z" fill="#ED404A"/>\n</svg>\n\n <div class="msg_content">\n <div class="msg_title">\n ${e.title}\n </div>\n <div class="msg_desc">\n ${e.description||""}\n </div>\n </div>\n <div class="chevron"></div>\n </div>\n `)).join("")},b=function(){e(this,f,"f").querySelectorAll(".msg").forEach((e=>{const t=e,n=t.querySelector(".msg_desc"),s=n.scrollWidth>n.clientWidth,i=n.clientHeight>20;s||i?(t.classList.add("collapsible"),t.onclick=e=>{e.target.classList.contains("msg_desc")||t.classList.toggle("collapsed")}):(t.classList.remove("collapsible"),t.onclick=null)}))},v=function(){const[t,n]=a(e(this,h,"f"),Number.parseInt(e(this,h,"f").style.left,10),Number.parseInt(e(this,h,"f").style.top,10),{top:"all",bottom:100,left:100,right:100});e(this,h,"f").style.top=`${n}px`,e(this,h,"f").style.left=`${t}px`},customElements.define("descope-debugger",w);export{w as default}; | ||
//# sourceMappingURL=debugger-wc-6f11e405.js.map |
@@ -1,3 +0,3 @@ | ||
// @descope/user-management-widget v0.2.0 | ||
// @descope/user-management-widget v0.2.1 | ||
import{__classPrivateFieldGet as e,__classPrivateFieldSet as t,__awaiter as i,__rest as s}from"tslib";import{createSelector as o}from"reselect";import{createSlice as n,configureStore as r,unwrapResult as a,createAsyncThunk as l}from"@reduxjs/toolkit";import d from"@descope/web-js-sdk";import c from"libphonenumber-js/min";function u(...e){return t=>e.reduce(((e,t)=>t(e)),t)}const h=e=>{const t=Symbol((e=>{const t=e.toString();let i=0;for(let e=0;e<t.length;e++)i=(i<<5)-i+t.charCodeAt(e),i&=i;return i.toString(16)})(e));return i=>{if(i[t])return i;const s=e(i);return s[t]=!0,s}},v=h((s=>{var o,n;return n=class extends s{constructor(){super(...arguments),o.set(this,!0)}connectedCallback(){var i,s;null===(i=super.connectedCallback)||void 0===i||i.call(this),(null===(s=this.shadowRoot)||void 0===s?void 0:s.isConnected)&&e(this,o,"f")&&(t(this,o,!1,"f"),this.init())}init(){return i(this,void 0,void 0,(function*(){}))}},o=new WeakMap,n})),g=["error","warn","info","debug"],m=h((i=>{var s,o,n,r;return r=class extends i{constructor(){super(...arguments),s.add(this),o.set(this,e(this,s,"m",n).call(this,console))}set logger(i){t(this,o,e(this,s,"m",n).call(this,i),"f")}get logger(){return e(this,o,"f")}onLogEvent(e,t){}},o=new WeakMap,s=new WeakSet,n=function(e){return g.reduce(((t,i)=>(t[i]=(...t)=>{var s;this.onLogEvent(i,t),null===(s=e[i])||void 0===s||s.call(e,...t)},t)),{})},r})),p=h((s=>{var o,n,r,a,l,d,c;return c=class extends(u(v,m)(s)){constructor(){super(...arguments),o.add(this),n.set(this,void 0),this.attributeChangedCallback=(t,i,s)=>{var n;null===(n=super.attributeChangedCallback)||void 0===n||n.call(this,t,i,s),"debug"===t&&e(this,o,"m",l).call(this)}}get debug(){return"true"===this.getAttribute("debug")}onLogEvent(t,i){var s;null===(s=super.onLogEvent)||void 0===s||s.call(this,t,i),"error"===t&&e(this,o,"m",d).call(this,i[0]||"Error",i[1])}init(){const t=Object.create(null,{init:{get:()=>super.init}});var s;return i(this,void 0,void 0,(function*(){yield null===(s=t.init)||void 0===s?void 0:s.call(this),e(this,o,"m",l).call(this)}))}},n=new WeakMap,o=new WeakSet,r=function(){var i;null===(i=e(this,n,"f"))||void 0===i||i.remove(),t(this,n,null,"f")},a=function(){return i(this,void 0,void 0,(function*(){t(this,n,document.createElement("descope-debugger"),"f"),Object.assign(e(this,n,"f").style,{position:"fixed",top:"0",right:"0",height:"100vh",width:"100vw",pointerEvents:"none",zIndex:99999}),yield import("./debugger-wc-6f11e405.js"),document.body.appendChild(e(this,n,"f"))}))},l=function(){this.debug?e(this,o,"m",a).call(this):e(this,o,"m",r).call(this)},d=function(t,i){var s;t&&(null===(s=e(this,n,"f"))||void 0===s||s.updateData({title:t,description:i}))},c})),f=(e,t)=>e.length===t.length&&e.every(((e,i)=>e===t[i])),b=e=>{let t,i;return(...s)=>(t&&f(t,s)||(t=s,i=e(...s)),i)},y=e=>(t,...i)=>t.reduce(((t,s,o)=>{var n;return`${t}${s}${(null===(n=null==i?void 0:i[o])||void 0===n?void 0:n[e>1?1:0])||""}`}),""),w=(e,t=500)=>{let i;return function(...s){clearTimeout(i),i=setTimeout((()=>e.apply(this,s)),t)}},C="undefined"!=typeof localStorage,M=C&&localStorage.getItem("base.content.url")||"https://static.descope.com/pages",R=(e,t)=>!t&&`${e} cannot be empty`,x=h((t=>{var s,o;const n=u(m,v)(t);return o=class extends n{constructor(){super(...arguments),s.set(this,{})}init(){const t=Object.create(null,{init:{get:()=>super.init}});var o;return i(this,void 0,void 0,(function*(){var i,n;yield null===(o=t.init)||void 0===o?void 0:o.call(this),i=this,n=t=>{var i;null===(i=e(this,s,"f")[t])||void 0===i||i.forEach((e=>{e(t,this.getAttribute(t))}))},Array.from(i.attributes).forEach((e=>n(e.name))),new MutationObserver((e=>{e.forEach((e=>{"attributes"===e.type&&n(e.attributeName)}))})).observe(i,{attributes:!0})}))}observeAttribute(t,i){e(this,s,"f")[t]||(e(this,s,"f")[t]=[]);const o=e(this,s,"f")[t].push(i);return()=>e(this,s,"f")[t].splice(o,1)}observeAttributes(e,t){const i=e.reduce(((e,i)=>(e.push(this.observeAttribute(i,t)),e)),[]);return()=>i.forEach((e=>e()))}},s=new WeakMap,o})),U=t=>s=>{var o,n,r;const a=u(m,v,x)(s),l=Object.keys(t);return r=class extends a{constructor(...t){super(...t),o.add(this),this.observeAttributes(l,e(this,o,"m",n).bind(this))}init(){const t=Object.create(null,{init:{get:()=>super.init}});var s;return i(this,void 0,void 0,(function*(){yield null===(s=t.init)||void 0===s?void 0:s.call(this),l.forEach((t=>e(this,o,"m",n).call(this,t,this.getAttribute(t))))}))}},o=new WeakSet,n=function(e,i){const s=t[e],o="function"==typeof s?s(e,i):s;o&&this.logger.error(o)},r},k=h((e=>{const t=u(U({"project-id":R}))(e);return class extends t{get projectId(){return this.getAttribute("project-id")}}}));const j=h((e=>{const t=u(m,k)(e);return class extends t{fetchStaticResource(e,t){return i(this,void 0,void 0,(function*(){const i=function(e,t,i="v2-beta"){const s=new URL(M);return s.pathname=((...e)=>e.join("/").replace(/\/+/g,"/"))(s.pathname,e,i,t),s.toString()}(this.projectId,e),s=yield fetch(i,{cache:"default"});return s.ok||this.logger.error(`Error fetching URL ${i} [${s.status}]`),{body:yield s[t](),headers:Object.fromEntries(s.headers.entries())}}))}}})),W=h((s=>{var o,n,r;const a=u(j)(s);return r=class extends a{constructor(){super(...arguments),o.set(this,void 0),n.set(this,(()=>i(this,void 0,void 0,(function*(){try{const{body:e,headers:t}=yield this.fetchStaticResource("config.json","json");return{projectConfig:e,executionContext:{geo:t["x-geo"]}}}catch(e){this.logger.error("Cannot fetch config file","make sure that your projectId & flowId are correct")}}))))}get config(){return e(this,o,"f")||t(this,o,e(this,n,"f").call(this),"f"),e(this,o,"f")}},o=new WeakMap,n=new WeakMap,r})),S="load-descope-ui",I="base.ui.components.url",E=C&&localStorage.getItem(I)||"https://static.descope.com/npm/@descope/web-components-ui@<version>/dist/umd/index.js",L=C&&localStorage.getItem(I)||"https://cdn.jsdelivr.net/npm/@descope/web-components-ui@<version>/dist/umd/index.js",O=e=>{const t=document.createElement("script");return t.id=e,t},A=(e,t)=>e.replace("<version>",t),N=h((s=>{var o,n,r,a,l,d,c,h,v,g,p,f;const b=u(m,W)(s);return f=class extends b{constructor(){super(...arguments),o.add(this),n.set(this,Symbol("errorCbs")),r.set(this,Symbol("loadCbs")),v.set(this,void 0)}get descopeUi(){return e(this,v,"f")||t(this,v,e(this,o,"m",p).call(this),"f"),e(this,v,"f")}loadDescopeUiComponents(t){return i(this,void 0,void 0,(function*(){const i=Array.isArray(t)?t:(s=t,[...Array.from(s.content.querySelectorAll("*")).reduce(((e,t)=>t.localName.startsWith("descope-")?e.add(t.localName):e),new Set)]);var s;return Promise.all(i.map((t=>e(this,o,"m",g).call(this,t))))}))}},n=new WeakMap,r=new WeakMap,v=new WeakMap,o=new WeakSet,a=function(){var e;return i(this,void 0,void 0,(function*(){const t=yield this.config,i=null===(e=null==t?void 0:t.projectConfig)||void 0===e?void 0:e.componentsVersion;return i?this.logger.debug(`Got component version "${i}"`):this.logger.error("Could not get components version"),i}))},l=function(t){const i=e(this,n,"f"),s=e(this,r,"f");t[i]=[],t[s]=[],Object.defineProperty(t,"onerror",{set(e){t[i].push(e)}}),Object.defineProperty(t,"onload",{set(e){t[s].push(e)}})},d=function(t,s){return i(this,void 0,void 0,(function*(){this.logger.debug("Trying to load DescopeUI from a fallback URL");const i=O("load-descope-ui-fallback-script");document.body.append(i),i.addEventListener("error",(()=>{t.forEach((e=>e(`Cannot load DescopeUI from fallback URL, Make sure this URL is valid and return the correct script: "${i.src}"`)))})),i.addEventListener("load",(()=>{s.forEach((e=>e()))})),i.src=A(L,yield e(this,o,"m",a).call(this))}))},c=function(t){t.addEventListener("error",(()=>{t[e(this,n,"f")].forEach((e=>e(`Cannot load DescopeUI from main URL, Make sure this URL is valid and return the correct script: "${t.src}"`))),e(this,o,"m",d).call(this,t[e(this,n,"f")],t[e(this,r,"f")])})),t.addEventListener("load",(()=>{t[e(this,r,"f")].forEach((e=>e()))}))},h=function(){return i(this,void 0,void 0,(function*(){if(document.querySelector(`script#${S}`))this.logger.debug("DescopeUI loading script already exists",this);else{this.logger.debug("DescopeUI loading script does not exist, creating it",this);const t=O(S);document.body.append(t),e(this,o,"m",l).call(this,t),e(this,o,"m",c).call(this,t),t.src=A(E,yield e(this,o,"m",a).call(this))}return document.getElementById(S)}))},g=function(e){return i(this,void 0,void 0,(function*(){if(!!customElements.get(e))return void this.logger.debug(`Loading component "${e}" is skipped as it is already defined`);const t=yield this.descopeUi;if(t[e])try{return yield t[e]()}catch(t){if("NotSupportedError"!==t.name)throw t;console.debug(`Encountered an error while attempting to define the "${e}" component, it is likely that this component is already defined`)}else this.logger.error(`Cannot load UI component "${e}"`,`Descope UI does not have a component named "${e}", available components are: "${Object.keys(t).join(", ")}"`)}))},p=function(){return new Promise((t=>{globalThis.DescopeUI&&t(globalThis.DescopeUI),e(this,o,"m",h).call(this).then((e=>{e.onerror=this.logger.error,e.onload=()=>{this.logger.debug("DescopeUI was loaded"),t(globalThis.DescopeUI)},setTimeout((()=>{globalThis.DescopeUI&&t(globalThis.DescopeUI)}))}))}))},f})),P="content-root",$="root",D=h((e=>class extends e{constructor(...e){var t,i;super(...e),this.attachShadow({mode:"open"}).innerHTML=`\n\n <style>\n #${$}, #${P} {\n height: 100%;\n }\n </style>\n <div id="${$}">\n <div id="${P}"></div>\n </div>\n `,this.contentRootElement=null===(t=this.shadowRoot)||void 0===t?void 0:t.getElementById(P),this.rootElement=null===(i=this.shadowRoot)||void 0===i?void 0:i.getElementById($)}})),T=(e,t)=>!!t&&"light"!==t&&"dark"!==t&&'Supported theme values are "light", "dark", or leave empty for using the OS theme',F=h((s=>{var o,n,r,a,l,d,c,h,g;const m=u(U({theme:T}),j,v,N,W,D)(s);return g=class extends m{constructor(){super(...arguments),o.add(this),n.set(this,void 0)}get theme(){var e,t;const i=this.getAttribute("theme");if("os"===i){return window.matchMedia&&(null===(t=null===(e=window.matchMedia)||void 0===e?void 0:e.call(window,"(prefers-color-scheme: dark)"))||void 0===t?void 0:t.matches)?"dark":"light"}return i||"light"}init(){const t=Object.create(null,{init:{get:()=>super.init}});var s;return i(this,void 0,void 0,(function*(){yield null===(s=t.init)||void 0===s?void 0:s.call(this),e(this,o,"m",l).call(this),e(this,o,"m",d).call(this),e(this,o,"m",c).call(this),e(this,o,"m",h).call(this)}))}},n=new WeakMap,o=new WeakSet,r=function(){return i(this,void 0,void 0,(function*(){try{const{body:e}=yield this.fetchStaticResource("theme.json","json");return e}catch(e){this.logger.error("Cannot fetch theme file","make sure that your projectId & flowId are correct")}}))},a=function(){return e(this,n,"f")||(t(this,n,e(this,o,"m",r).call(this),"f"),e(this,n,"f").then((e=>this.logger.debug("Fetched theme",e)))),e(this,n,"f")},l=function(){var t,s;return i(this,void 0,void 0,(function*(){const i=yield e(this,o,"a",a);if(!i)return;const n=document.createElement("style");n.innerText=((null===(t=null==i?void 0:i.light)||void 0===t?void 0:t.globals)||"")+((null===(s=null==i?void 0:i.dark)||void 0===s?void 0:s.globals)||""),this.shadowRoot.appendChild(n)}))},d=function(){var t,s;return i(this,void 0,void 0,(function*(){const i=Object.assign({},yield e(this,o,"a",a));if(!i)return;const n=yield this.descopeUi;(null==n?void 0:n.componentsThemeManager)&&(n.componentsThemeManager.themes={light:null===(t=null==i?void 0:i.light)||void 0===t?void 0:t.components,dark:null===(s=null==i?void 0:i.dark)||void 0===s?void 0:s.components})}))},c=function(){var e,t;return i(this,void 0,void 0,(function*(){const{projectConfig:i}=yield this.config,s=null===(t=null===(e=null==i?void 0:i.cssTemplate)||void 0===e?void 0:e[this.theme])||void 0===t?void 0:t.fonts;s&&Object.values(s).forEach((e=>{e.url&&(this.logger.debug(`Loading font from URL "${e.url}"`),(e=>{const t=document.createElement("link");t.href=e,t.rel="stylesheet",document.head.appendChild(t)})(e.url))}))}))},h=function(){return i(this,void 0,void 0,(function*(){this.rootElement.setAttribute("data-theme",this.theme);const e=yield this.descopeUi;(null==e?void 0:e.componentsThemeManager)&&(e.componentsThemeManager.currentThemeName=this.theme)}))},g}));var q;class B{constructor(e,i){q.set(this,void 0),this.nodeName="",t(this,q,e,"f"),this.logger=i.logger}get asyncEle(){return t=e(this,q,"f"),s=1e3,i(void 0,void 0,void 0,(function*(){return new Promise((e=>{const i=setInterval((()=>{const s="function"==typeof t?t():t;s&&(clearInterval(i),e(s))}),100);setTimeout((()=>{clearInterval(i),e(null)}),s)}))}));var t,s}get ele(){var t,i;const s="function"==typeof e(this,q,"f")?e(this,q,"f").call(this):e(this,q,"f");return s?(null==s?void 0:s.localName)!==this.nodeName?(null===(i=this.logger)||void 0===i||i.debug(`node name do not match, expected "${this.nodeName}", received "${s.localName}" `,Error()),null):s:(null===(t=this.logger)||void 0===t||t.debug("no element for driver ",this.constructor.name,new Error),null)}}q=new WeakMap;class H extends B{constructor(){super(...arguments),this.nodeName="descope-button"}onClick(e){var t;return null===(t=this.ele)||void 0===t||t.addEventListener("click",e),()=>{var t;return null===(t=this.ele)||void 0===t?void 0:t.removeEventListener("click",e)}}disable(){var e;null===(e=this.ele)||void 0===e||e.setAttribute("disabled","true")}enable(){var e;null===(e=this.ele)||void 0===e||e.removeAttribute("disabled")}}const V=e=>{const t=document.createElement("template");return t.innerHTML=e,t},Z=h((e=>class extends(m(e)){validateForm(e){return this.getFormInputs(e).every((e=>{var t,i;return null===(t=e.reportValidity)||void 0===t||t.call(e),null===(i=e.checkValidity)||void 0===i?void 0:i.call(e)}))}getFormInputs(e){return e?Array.from(e.querySelectorAll("[name]")):(this.logger.debug("cannot get form inputs, no root element was received"),[])}getFormData(e){return this.getFormInputs(e).reduce(((e,t)=>Object.assign(e,{[t.getAttribute("name")]:t.value})),{})}setFormData(e,t){this.getFormInputs(e).forEach((e=>{t.hasOwnProperty(e.getAttribute("name"))&&(e.value=t[e.getAttribute("name")])}))}resetFormData(e){this.getFormInputs(e).forEach((e=>{e.value=""}))}})),z="descope-modal";var J;class G extends B{constructor(){super(...arguments),J.set(this,void 0),this.nodeName="descope-modal"}close(){var e,t;null===(e=this.ele)||void 0===e||e.removeAttribute("opened"),null===(t=this.afterClose)||void 0===t||t.call(this)}open(){var e,t;return i(this,void 0,void 0,(function*(){yield null===(e=this.beforeOpen)||void 0===e?void 0:e.call(this),null===(t=this.ele)||void 0===t||t.setAttribute("opened","true")}))}reset(){var t;this.ele&&(this.ele.innerHTML=""),e(this,J,"f")&&(null===(t=this.ele)||void 0===t||t.append(e(this,J,"f").content.cloneNode(!0)))}setContent(e){t(this,J,e,"f"),this.reset()}remove(){var e;null===(e=this.ele)||void 0===e||e.remove()}}J=new WeakMap;const K=h((t=>{var s,o;const n=u(v,D,N)(t);return o=class extends n{constructor(){super(...arguments),s.set(this,(()=>{const e=this.loadDescopeUiComponents.bind(this);return class extends G{setContent(t){e(t),super.setContent(t)}}})())}createModal(t){const i=((e={})=>{const t=document.createElement(z);return Object.keys(e).forEach((i=>{t.setAttribute(i,e[i])})),t})(Object.assign(Object.assign({},{}),t));return this.rootElement.append(i),new(e(this,s,"f"))(i,{logger:this.logger})}init(){const e=Object.create(null,{init:{get:()=>super.init}});var t;return i(this,void 0,void 0,(function*(){this.loadDescopeUiComponents([z]),yield null===(t=e.init)||void 0===t?void 0:t.call(this)}))}},s=new WeakMap,o}));class Q extends B{constructor(){super(...arguments),this.nodeName="descope-multi-select-combo-box"}setData(e){var t;return i(this,void 0,void 0,(function*(){null===(t=yield this.asyncEle)||void 0===t||t.setAttribute("data",JSON.stringify(e.sort()))}))}}const X={enabled:"active"},Y=e=>e.tenantRoles.data,_=e=>e.selectedUsersLoginIds,ee=e=>e.notifications,te=o((e=>e.usersList.data),(e=>e.map((e=>Object.assign(Object.assign({},e),{status:X[e.status]||e.status,roles:e.roleNames}))))),ie=o(te,_,((e,t)=>e.filter((e=>t.includes(e.loginIds))).map((e=>e.userId)))),se=o(_,te,((e,t)=>t.filter((t=>e.includes(t.loginIds))))),oe=o(_,(e=>!!e.length)),ne=o(_,(e=>1===e.length)),re=o(se,(e=>1===e.length?e[0].email:`${e.length} users`)),ae=e=>h((t=>{const s=n(e),o=Object.assign(Object.assign({},s.actions),e.asyncActions);return class extends(u(m)(t)){constructor(...e){super(...e);const t=r({reducer:s.reducer,middleware:e=>e({thunk:{extraArgument:this},serializableCheck:!1}),devTools:!1}),n=e=>(...s)=>i(this,void 0,void 0,(function*(){const i=yield t.dispatch(e(...s));try{a(i)}catch(e){this.logger.error(e.message,i.type,e.stack)}return i})),l=Object.keys(o).reduce(((e,t)=>(e[t]=n(o[t]),e)),{});this.actions=l,this.subscribe=(e,i=(e=>e))=>t.subscribe((()=>e(i(t.getState()))))}}})),le=e=>(...t)=>i=>{i.addCase(e.pending,((e,i)=>{t.forEach((({onPending:t})=>{null==t||t(e,i)}))})),i.addCase(e.fulfilled,((e,i)=>{t.forEach((({onFulfilled:t})=>{null==t||t(e,i)}))})),i.addCase(e.rejected,((e,i)=>{t.forEach((({onRejected:t})=>{null==t||t(e,i)}))}))},de=e=>({onFulfilled:t=>{e(t).loading=!1},onPending:t=>{e(t).loading=!0,e(t).error=null},onRejected:(t,i)=>{e(t).loading=!1,e(t).error=i.error}}),ce=({getErrorMsg:e,getSuccessMsg:t})=>({onFulfilled:(e,i)=>{t&&e.notifications.push({type:"success",msg:t(i)})},onRejected:(t,i)=>{e&&t.notifications.push({type:"error",msg:e(i)})}}),ue=l("users/create",((e,{extra:{api:t}})=>t.user.create(e))),he=le(ue)({onFulfilled:(e,t)=>{e.usersList.data.unshift(t.payload)}},de((e=>e.createUser)),ce({getSuccessMsg:()=>"User created successfully",getErrorMsg:e=>{var t;return`\n <div>\n <div>Failed to create user</div>\n ${null===(t=e.error)||void 0===t?void 0:t.message}\n </div>`}})),ve={action:ue,reducer:he},ge=l("users/delete",((e,{extra:{api:t}})=>t.user.deleteBatch(e))),me=le(ge)({onFulfilled:(e,t)=>{e.usersList.data=e.usersList.data.filter((e=>!t.meta.arg.includes(e.userId))),e.selectedUsersLoginIds=[]}},de((e=>e.deleteUser)),ce({getSuccessMsg:e=>y(e.meta.arg.length)`${["",e.meta.arg.length]} ${["U","u"]}ser${["","s"]} deleted successfully`,getErrorMsg:e=>y(e.meta.arg.length)`Failed to delete user${["","s"]}`})),pe={action:ge,reducer:me},fe=l("users/expirePassword",((e,{extra:{api:t}})=>t.user.expirePassword(e))),be={action:fe,reducer:le(fe)(de((e=>e.expireUserPassword)))},ye=l("users/getCustomAttributes",((e,{extra:{api:t}})=>t.user.getCustomAttributes())),we=le(ye)({onFulfilled:(e,t)=>{e.customAttributes.data=t.payload}},de((e=>e.customAttributes))),Ce={action:ye,reducer:we},Me=l("users/search",((e,{extra:{api:t},getState:i})=>{const s=i().searchParams;return t.user.search(Object.assign(Object.assign({},s),e))})),Re=le(Me)({onPending:(e,t)=>{e.searchParams=Object.assign(Object.assign({},e.searchParams),t.meta.arg)},onFulfilled:(e,t)=>{e.usersList.data=t.payload}},de((e=>e.usersList))),xe={action:Me,reducer:Re},Ue=l("tenant/getTenantRoles",((e,{extra:{api:t}})=>t.tenant.getTenantRoles())),ke=le(Ue)({onFulfilled:(e,t)=>{e.tenantRoles.data=t.payload.roles}},de((e=>e.tenantRoles))),je={action:Ue,reducer:ke},We=l("users/update",((e,{extra:{api:t}})=>t.user.update(e))),Se={action:We,reducer:le(We)({onFulfilled:(e,t)=>{const i=e.usersList.data.findIndex((e=>f(e.loginIds,t.payload.loginIds)));-1!==i&&(e.usersList.data[i]=t.payload)}},de((e=>e.updateUser)),ce({getSuccessMsg:()=>"User updated successfully",getErrorMsg:e=>{var t;return`\n <div>\n <div>Failed to update user</div>\n ${null===(t=e.error)||void 0===t?void 0:t.message}\n </div>`}}))},Ie={usersList:{data:[],loading:!1,error:null},createUser:{loading:!1,error:null},updateUser:{loading:!1,error:null},deleteUser:{loading:!1,error:null},expireUserPassword:{loading:!1,error:null},customAttributes:{loading:!1,error:null,data:{}},tenantRoles:{loading:!1,error:null,data:[]},searchParams:{text:"",sort:[]},selectedUsersLoginIds:[],notifications:[]},Ee={search:"/v1/mgmt/user/search",deleteBatch:"/v1/mgmt/user/delete/batch",create:"/v1/mgmt/user/create",update:"/v1/mgmt/user/update",expirePassword:"/v1/mgmt/user/password/expire",customAttributes:"/v1/mgmt/user/customattributes"},Le={roles:"/v1/mgmt/role/all"},Oe=e=>i(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)})),Ae=({httpClient:e,tenant:t})=>({search:({page:s,limit:o=1e4,customAttributes:n,statuses:r,emails:a,phones:l,text:d,sort:c}={})=>i(void 0,void 0,void 0,(function*(){const i=yield e.post(Ee.search,{limit:o,page:s,withTestUser:!1,customAttributes:n,statuses:r,emails:a,phones:l,text:d,sort:c},{queryParams:{tenant:t}});yield Oe(i);return(yield i.json()).users})),deleteBatch:s=>i(void 0,void 0,void 0,(function*(){const i=yield e.post(Ee.deleteBatch,{userIds:s},{queryParams:{tenant:t}});return yield Oe(i),i.json()})),create:({loginId:s,email:o,phone:n,displayName:r,roles:a,customAttributes:l,picture:d,verifiedEmail:c,verifiedPhone:u,givenName:h,middleName:v,familyName:g,additionalLoginIds:m,sendSMS:p,sendMail:f,inviteUrl:b,invite:y})=>i(void 0,void 0,void 0,(function*(){const i=yield e.post(Ee.create,{loginId:s,email:o,phone:n,displayName:r,givenName:h,middleName:v,familyName:g,roleNames:a,userTenants:[{tenantId:t}],customAttributes:l,picture:d,verifiedEmail:c,verifiedPhone:u,additionalLoginIds:m,sendSMS:p,sendMail:f,inviteUrl:b,invite:y},{queryParams:{tenant:t}});yield Oe(i);return(yield i.json()).user})),update:({loginId:s,email:o,phone:n,displayName:r,roles:a,customAttributes:l,picture:d,verifiedEmail:c,verifiedPhone:u,givenName:h,middleName:v,familyName:g,additionalLoginIds:m})=>i(void 0,void 0,void 0,(function*(){const i=yield e.post(Ee.update,{loginId:s,email:o,phone:n,displayName:r,givenName:h,middleName:v,familyName:g,roleNames:a,customAttributes:l,picture:d,verifiedEmail:c,verifiedPhone:u,additionalLoginIds:m},{queryParams:{tenant:t}});yield Oe(i);return(yield i.json()).user})),expirePassword:s=>i(void 0,void 0,void 0,(function*(){const i=yield e.post(Ee.expirePassword,{loginId:s[0]},{queryParams:{tenant:t}});return yield Oe(i),i.json()})),getCustomAttributes:()=>i(void 0,void 0,void 0,(function*(){const i=yield e.get(Ee.customAttributes,{queryParams:{tenant:t}});return yield Oe(i),i.json()}))}),Ne=({httpClient:e,tenant:t})=>({getTenantRoles:()=>i(void 0,void 0,void 0,(function*(){const i=yield e.get(Le.roles,{queryParams:{tenant:t}});return yield Oe(i),i.json()}))}),Pe=h((s=>{var o,n,r,a;const l=u(k,x,m,U({tenant:R}))(s);return a=class extends l{constructor(){super(...arguments),o.add(this),n.set(this,void 0)}get baseUrl(){return this.getAttribute("base-url")}get tenant(){return this.getAttribute("tenant")}get api(){return e(this,n,"f")||e(this,o,"m",r).call(this),e(this,n,"f")}init(){const t=Object.create(null,{init:{get:()=>super.init}});var s;return i(this,void 0,void 0,(function*(){yield null===(s=t.init)||void 0===s?void 0:s.call(this),this.observeAttributes(["project-id","base-url","tenant"],(()=>{e(this,n,"f")&&e(this,o,"m",r).call(this)}))}))}},n=new WeakMap,o=new WeakSet,r=function(){this.logger.debug("creating an sdk instance"),t(this,n,((e,t)=>{const i=d(Object.assign(Object.assign({},e),{persistTokens:!0}));return{user:Ae({httpClient:i.httpClient,tenant:t}),tenant:Ne({httpClient:i.httpClient,tenant:t})}})({projectId:this.projectId,baseUrl:this.baseUrl},this.tenant),"f")},a})),$e=h((e=>{const t=u(ae({name:"widget",initialState:Ie,reducers:{setSelectedUsersIds:(e,{payload:t})=>{e.selectedUsersLoginIds=t},clearNotifications:e=>{e.notifications=[]}},extraReducers:e=>{ve.reducer(e),Se.reducer(e),pe.reducer(e),xe.reducer(e),be.reducer(e),Ce.reducer(e),je.reducer(e)},asyncActions:{searchUsers:xe.action,createUser:ve.action,updateUser:Se.action,deleteUsers:pe.action,expireUserPassword:be.action,getCustomAttributes:Ce.action,getTenantRoles:je.action}}),v,m,Pe)(e);return class extends t{constructor(...e){super(...e),this.state=Ie,this.subscribe((e=>{this.logger.debug("State update:",e),this.state=e}))}}})),De=h((e=>{const t=u(j,U({"widget-id":R}))(e);return class extends t{get widgetId(){return this.getAttribute("widget-id")}fetchWidgetPage(e){return i(this,void 0,void 0,(function*(){return(yield this.fetchStaticResource(`user-management-widget/${this.widgetId}/${e}`,"text")).body}))}}})),Te=h((t=>{var s,o,n;return n=class extends(u(m,v,N,D,De,$e)(t)){constructor(){super(...arguments),s.add(this)}onWidgetRootReady(){return i(this,void 0,void 0,(function*(){}))}init(){const t=Object.create(null,{init:{get:()=>super.init}});var n;return i(this,void 0,void 0,(function*(){yield null===(n=t.init)||void 0===n?void 0:n.call(this),yield Promise.all([e(this,s,"m",o).call(this),this.actions.searchUsers(),this.actions.getTenantRoles()]),this.onWidgetRootReady()}))}},s=new WeakSet,o=function(){return i(this,void 0,void 0,(function*(){const e=V(yield this.fetchWidgetPage("root.html"));yield this.loadDescopeUiComponents(e),this.contentRootElement.append(e.content.cloneNode(!0))}))},n})),Fe=h((s=>{var o,n,r,a,l;return l=class extends(u($e,K,Z,m,Te)(s)){constructor(){super(...arguments),o.add(this),n.set(this,void 0),a.set(this,(()=>i(this,void 0,void 0,(function*(){yield e(this,n,"f").setData(Y(this.state).map((({name:e})=>({value:e,label:e}))))}))))}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return i(this,void 0,void 0,(function*(){yield null===(s=t.onWidgetRootReady)||void 0===s?void 0:s.call(this),e(this,o,"m",r).call(this)}))}},n=new WeakMap,a=new WeakMap,o=new WeakSet,r=function(){return i(this,void 0,void 0,(function*(){this.createUserModal=this.createModal(),this.createUserModal.setContent(V(yield this.fetchWidgetPage("create-user-modal.html")));const s=new H((()=>{var e;return null===(e=this.createUserModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-cancel"]')}),{logger:this.logger});s.onClick((()=>{this.createUserModal.close(),this.resetFormData(this.createUserModal.ele)}));const o=new H((()=>{var e;return null===(e=this.createUserModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-submit"]')}),{logger:this.logger});o.onClick((()=>i(this,void 0,void 0,(function*(){this.validateForm(this.createUserModal.ele)&&(this.actions.createUser(Object.assign(Object.assign({},this.getFormData(this.createUserModal.ele)),{invite:!0,verifiedEmail:!0,verifiedPhone:!0})),this.createUserModal.close(),this.resetFormData(this.createUserModal.ele))})))),t(this,n,new Q((()=>{var e;return null===(e=this.createUserModal.ele)||void 0===e?void 0:e.querySelector('[data-id="roles-multiselect"]')}),{logger:this.logger}),"f"),e(this,a,"f").call(this)}))},l})),qe=h((t=>{var s,o,n;return n=class extends(u(m,Fe,Te)(t)){constructor(){super(...arguments),s.add(this)}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var n;return i(this,void 0,void 0,(function*(){yield null===(n=t.onWidgetRootReady)||void 0===n?void 0:n.call(this),e(this,s,"m",o).call(this)}))}},s=new WeakSet,o=function(){var e;this.createButton=new H(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="create-user"]'),{logger:this.logger}),this.createButton.onClick((()=>this.createUserModal.open()))},n}));class Be extends B{constructor(){super(...arguments),this.nodeName="descope-text"}get ele(){return super.ele}get text(){var e;return null===(e=this.ele)||void 0===e?void 0:e.innerText}set text(e){this.ele&&(this.ele.innerText=e)}}const He=h((t=>{var s,o,n;return n=class extends(u($e,K,m,Te)(t)){constructor(){super(...arguments),s.add(this)}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var n;return i(this,void 0,void 0,(function*(){yield null===(n=t.onWidgetRootReady)||void 0===n?void 0:n.call(this),yield e(this,s,"m",o).call(this)}))}},s=new WeakSet,o=function(){var e;return i(this,void 0,void 0,(function*(){this.deleteUsersModal=this.createModal(),this.deleteUsersModal.setContent(V(yield this.fetchWidgetPage("delete-users-modal.html")));const t=new H((()=>{var e;return null===(e=this.deleteUsersModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-cancel"]')}),{logger:this.logger});t.onClick((()=>this.deleteUsersModal.close()));const i=new H((()=>{var e;return null===(e=this.deleteUsersModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-submit"]')}),{logger:this.logger});i.onClick((()=>{const e=ie(this.state);this.actions.deleteUsers(e),this.deleteUsersModal.close()}));const s=new Be(null===(e=this.deleteUsersModal.ele)||void 0===e?void 0:e.querySelector('[data-id="body-text"]'),{logger:this.logger});this.deleteUsersModal.beforeOpen=()=>{const e=re(this.state);s.text=`Delete ${e}?`}}))},n})),Ve=h((t=>{var s,o,n,r;return r=class extends(u(m,Te,$e,He)(t)){constructor(){super(...arguments),s.add(this),n.set(this,b((e=>{e?this.deleteButton.enable():this.deleteButton.disable()})))}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var r;return i(this,void 0,void 0,(function*(){yield null===(r=t.onWidgetRootReady)||void 0===r?void 0:r.call(this),e(this,s,"m",o).call(this),this.subscribe(e(this,n,"f").bind(this),oe)}))}},n=new WeakMap,s=new WeakSet,o=function(){var e;this.deleteButton=new H(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="delete-users"]'),{logger:this.logger}),this.deleteButton.disable(),this.deleteButton.onClick((()=>{this.deleteUsersModal.open()}))},r}));class Ze extends B{constructor(){super(...arguments),this.nodeName="descope-text-field"}onInput(e){var t;return null===(t=this.ele)||void 0===t||t.addEventListener("input",e),()=>{var t;return null===(t=this.ele)||void 0===t?void 0:t.removeEventListener("input",e)}}get value(){var e;return null===(e=this.ele)||void 0===e?void 0:e.value}set value(e){this.ele&&(this.ele.value=e)}disable(){var e;null===(e=this.ele)||void 0===e||e.setAttribute("disabled","true")}enable(){var e;null===(e=this.ele)||void 0===e||e.removeAttribute("disabled")}}const ze=h((t=>{var s,o,n,r;return r=class extends(u(m,Te,$e)(t)){constructor(){super(...arguments),s.add(this),o.set(this,w((()=>{this.actions.searchUsers({text:this.searchInput.value})})))}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var o;return i(this,void 0,void 0,(function*(){yield null===(o=t.onWidgetRootReady)||void 0===o?void 0:o.call(this),e(this,s,"m",n).call(this)}))}},o=new WeakMap,s=new WeakSet,n=function(){var t;this.searchInput=new Ze(null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('[data-id="search-input"]'),{logger:this.logger}),this.searchInput.onInput(e(this,o,"f"))},r})),Je="descope-notification";class Ge extends B{constructor(){super(...arguments),this.nodeName="descope-notification"}close(){var e;null===(e=this.ele)||void 0===e||e.removeAttribute("opened")}show(){var e;null===(e=this.ele)||void 0===e||e.setAttribute("opened","true")}setContent(e){this.ele.innerHTML="",this.ele.appendChild(e.content.cloneNode(!0))}remove(){var e;null===(e=this.ele)||void 0===e||e.remove()}}const Ke=h((t=>{var s,o;const n=u(v,D,N)(t);return o=class extends n{constructor(){super(...arguments),s.set(this,(()=>{const e=this.loadDescopeUiComponents.bind(this);return class extends Ge{setContent(t){const i="string"==typeof t?V(t):t;e(i),super.setContent(i)}}})())}createNotification(t){const i=((e={})=>{const t=document.createElement(Je);return Object.keys(e).forEach((i=>{t.setAttribute(i,e[i])})),t})(Object.assign(Object.assign({},{}),t));return this.rootElement.append(i),new(e(this,s,"f"))(i,{logger:this.logger})}init(){const e=Object.create(null,{init:{get:()=>super.init}});var t;return i(this,void 0,void 0,(function*(){yield null===(t=e.init)||void 0===t?void 0:t.call(this),this.loadDescopeUiComponents([Je])}))}},s=new WeakMap,o}));const Qe={success:(new DOMParser).parseFromString('<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">\n<g id="Checkmark">\n<path id="Shape" d="M10.0485 15.6396C9.5799 15.171 8.8201 15.171 8.35147 15.6396C7.88284 16.1082 7.88284 16.868 8.35147 17.3367L12.7072 21.6924C13.1759 22.1611 13.9357 22.1611 14.4043 21.6924L24.7152 11.3815C25.1838 10.9129 25.1838 10.1531 24.7152 9.68448C24.2466 9.21585 23.4868 9.21585 23.0181 9.68448L13.5558 19.1469L10.0485 15.6396Z" fill="white"/>\n</g>\n</svg>\n',"image/svg+xml").firstChild,error:(new DOMParser).parseFromString('<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">\n<g id="Icon">\n<path id="Vector" d="M15.9998 26.6558C10.1118 26.6558 5.34375 21.8878 5.34375 15.9998C5.34375 10.1118 10.1118 5.34375 15.9998 5.34375C21.8878 5.34375 26.6558 10.1118 26.6558 15.9998C26.6558 21.8878 21.8878 26.6558 15.9998 26.6558ZM15.9998 24.4798C20.6718 24.4798 24.4798 20.7038 24.4798 15.9998C24.4798 11.3278 20.7038 7.51975 15.9998 7.51975C11.3278 7.51975 7.51975 11.2958 7.51975 15.9998C7.51975 20.6718 11.2958 24.4798 15.9998 24.4798ZM15.3278 9.34375H16.6718C17.0558 9.34375 17.3438 9.63175 17.3118 9.98375L16.9598 16.9278C16.9598 17.1838 16.7678 17.3438 16.5438 17.3438H15.4558C15.2318 17.3438 15.0398 17.1518 15.0398 16.9278L14.6878 9.98375C14.6878 9.63175 14.9758 9.34375 15.3278 9.34375ZM15.4558 19.4558H16.5438C16.9278 19.4558 17.2158 19.7438 17.1838 20.1278V21.1838C17.1838 21.5678 16.8958 21.8558 16.5438 21.8558H15.4558C15.0718 21.8558 14.7838 21.5678 14.7838 21.1838V20.1278C14.7838 19.7438 15.0718 19.4558 15.4558 19.4558Z" fill="#FFDFDD"/>\n</g>\n</svg>\n',"image/svg+xml").firstChild},Xe=h((t=>{var s,o,n,r,a;return a=class extends(u(m,$e,Ke,v)(t)){constructor(){super(...arguments),s.add(this),r.set(this,b((t=>{t.length&&(t.forEach((({type:t,msg:i})=>{const r=e(this,s,"m",n).call(this,t);r.setContent(e(this,s,"m",o).call(this,{type:t,msg:i})),r.show()})),setTimeout((()=>this.actions.clearNotifications())))})))}init(){const t=Object.create(null,{init:{get:()=>super.init}});var s;return i(this,void 0,void 0,(function*(){yield null===(s=t.init)||void 0===s?void 0:s.call(this),this.subscribe(e(this,r,"f").bind(this),ee)}))}},r=new WeakMap,s=new WeakSet,o=function({type:e,msg:t}){const i=Qe[e],s=Object.assign((new DOMParser).parseFromString('<svg width="2em" height="2em" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<g id="Icon">\n<path id="Shape" d="M10.6712 12L7.27521 8.60406C6.90826 8.23711 6.90826 7.64216 7.27521 7.27521C7.64216 6.90826 8.23711 6.90826 8.60406 7.27521L12 10.6712L15.3959 7.27521C15.7629 6.90826 16.3578 6.90826 16.7248 7.27521C17.0917 7.64216 17.0917 8.23711 16.7248 8.60406L13.3288 12L16.7248 15.3959C17.0917 15.7629 17.0917 16.3578 16.7248 16.7248C16.3578 17.0917 15.7629 17.0917 15.3959 16.7248L12 13.3288L8.60406 16.7248C8.23711 17.0917 7.64216 17.0917 7.27521 16.7248C6.90826 16.3578 6.90826 15.7629 7.27521 15.3959L10.6712 12Z" fill="white"/>\n</g>\n</svg>\n',"image/svg+xml").firstChild,{slot:"close"});return`${(null==i?void 0:i.outerHTML)||""}${t}${s.outerHTML}`},n=function(e){return this.createNotification({mode:e,duration:"error"===e?0:3e3,position:"bottom-start",size:"sm"})},a}));const Ye=/^descope-grid-([^-]+)-column$/,_e={text:class extends B{constructor(){super(...arguments),this.nodeName="descope-grid-text-column"}onSortDirectionChange(e){var t;return null===(t=this.ele)||void 0===t||t.addEventListener("direction-changed",e),()=>{var t;return null===(t=this.ele)||void 0===t?void 0:t.removeEventListener("selected-items-changed",e)}}},custom:class extends B{constructor(){super(...arguments),this.nodeName="descope-grid-custom-column"}onSortDirectionChange(e){var t;return null===(t=this.ele)||void 0===t||t.addEventListener("direction-changed",e),()=>{var t;return null===(t=this.ele)||void 0===t?void 0:t.removeEventListener("selected-items-changed",e)}}}};class et extends B{constructor(){super(...arguments),this.nodeName="descope-grid"}onSelectedItemsChange(e){var t;return null===(t=this.ele)||void 0===t||t.addEventListener("selected-items-changed",e),()=>{var t;return null===(t=this.ele)||void 0===t?void 0:t.removeEventListener("selected-items-changed",e)}}get ele(){return super.ele}get data(){var e;return null===(e=this.ele)||void 0===e?void 0:e.data}set data(e){this.ele&&(this.ele.data=e)}get columns(){return this.ele?Array.from(this.ele.children).reduce(((e,t)=>{var i;const s=null===(i=Ye.exec(t.localName))||void 0===i?void 0:i[1],o=_e[s];return o?(e.push(new o(t,{logger:this.logger})),e):e}),[]):[]}}const tt=h((t=>{var s,o,n,r,a;return a=class extends(u($e,m,Te)(t)){constructor(){super(...arguments),s.add(this),n.set(this,b((e=>{this.usersTable.data=e}))),r.set(this,w(((e,t)=>{const i=[],{value:s}=t;if(s){const t=e.path;i.push({field:t,desc:"desc"===s})}this.actions.searchUsers({sort:i})})))}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var a;return i(this,void 0,void 0,(function*(){yield null===(a=t.onWidgetRootReady)||void 0===a?void 0:a.call(this),e(this,s,"m",o).call(this),this.usersTable.columns.forEach((t=>{t.onSortDirectionChange((t=>{e(this,r,"f").call(this,t.target,t.detail)}))})),e(this,n,"f").call(this,te(this.state)),this.subscribe(e(this,n,"f").bind(this),te)}))}},n=new WeakMap,r=new WeakMap,s=new WeakSet,o=function(){var e;this.usersTable=new et(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="users-table"]'),{logger:this.logger}),this.usersTable.onSelectedItemsChange((e=>{this.actions.setSelectedUsersIds(e.detail.value.map((({loginIds:e})=>e)))}))},a})),it=e=>{if(!e)return e;const t=c(e),i=new RegExp(`(\\+?${t.countryCallingCode})(.*)`);return t.number.replace(i,"$1-$2")},st=h((o=>{var n,r,a,l,d,c,h,v,g;return g=class extends(u($e,K,m,Z,Te)(o)){constructor(){super(...arguments),n.add(this),r.set(this,void 0),a.set(this,void 0),c.set(this,(()=>i(this,void 0,void 0,(function*(){yield e(this,a,"f").setData(Y(this.state).map((({name:e})=>({value:e,label:e}))))})))),h.set(this,(()=>{var e,t;const i=null===(e=se(this.state))||void 0===e?void 0:e[0],s={loginId:null===(t=null==i?void 0:i.loginIds)||void 0===t?void 0:t.join(", "),displayName:null==i?void 0:i.name,email:null==i?void 0:i.email,phone:it(null==i?void 0:i.phone),roles:null==i?void 0:i.roles};this.setFormData(this.editUserModal.ele,s)}))}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return i(this,void 0,void 0,(function*(){yield null===(s=t.onWidgetRootReady)||void 0===s?void 0:s.call(this),yield e(this,n,"m",v).call(this)}))}},r=new WeakMap,a=new WeakMap,c=new WeakMap,h=new WeakMap,n=new WeakSet,l=function(){const e=new H((()=>{var e;return null===(e=this.editUserModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-cancel"]')}),{logger:this.logger});e.onClick((()=>this.editUserModal.close()))},d=function(){const e=new H((()=>{var e;return null===(e=this.editUserModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-submit"]')}),{logger:this.logger});e.onClick((()=>{if(this.validateForm(this.editUserModal.ele)){const e=this.getFormData(this.editUserModal.ele),{loginId:t}=e,i=s(e,["loginId"]);this.actions.updateUser(Object.assign({loginId:t.split(", ")[0]},i)),this.editUserModal.close(),this.resetFormData(this.editUserModal.ele)}}))},v=function(){var s;return i(this,void 0,void 0,(function*(){this.editUserModal=this.createModal(),this.editUserModal.setContent(V(yield this.fetchWidgetPage("edit-user-modal.html"))),e(this,n,"m",l).call(this),e(this,n,"m",d).call(this),t(this,r,new Ze(null===(s=this.editUserModal.ele)||void 0===s?void 0:s.querySelector('[name="loginId"]'),{logger:this.logger}),"f"),t(this,a,new Q((()=>{var e;return null===(e=this.editUserModal.ele)||void 0===e?void 0:e.querySelector('[data-id="roles-multiselect"]')}),{logger:this.logger}),"f"),this.editUserModal.beforeOpen=()=>i(this,void 0,void 0,(function*(){yield e(this,c,"f").call(this),e(this,r,"f").disable(),e(this,h,"f").call(this)}))}))},g})),ot=h((t=>{var s,o,n,r;return r=class extends(u(m,Te,$e,st,Z)(t)){constructor(){super(...arguments),s.add(this),n.set(this,b((e=>{e?this.editButton.enable():this.editButton.disable()})))}onWidgetRootReady(){const t=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var r;return i(this,void 0,void 0,(function*(){yield null===(r=t.onWidgetRootReady)||void 0===r?void 0:r.call(this),e(this,s,"m",o).call(this),this.subscribe(e(this,n,"f").bind(this),ne)}))}},n=new WeakMap,s=new WeakSet,o=function(){var e;this.editButton=new H(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="edit-user"]'),{logger:this.logger}),this.editButton.disable(),this.editButton.onClick((()=>{this.editUserModal.open()}))},r})),nt=h((e=>class extends(u(p,F,tt,qe,Ve,ot,ze,Xe)(e)){init(){const e=Object.create(null,{init:{get:()=>super.init}});var t;return i(this,void 0,void 0,(function*(){yield null===(t=e.init)||void 0===t?void 0:t.call(this)}))}})),rt=u((e=>class extends(nt(e)){}))(HTMLElement);customElements.define("descope-user-management-widget",rt);export{rt as default}; | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "@descope/user-management-widget", | ||
"version": "0.2.0", | ||
"version": "0.2.1", | ||
"author": "Descope Team <info@descope.com>", | ||
@@ -79,3 +79,3 @@ "homepage": "https://github.com/descope/descope-js", | ||
"libphonenumber-js": "1.10.57", | ||
"@descope/web-js-sdk": "1.10.1" | ||
"@descope/web-js-sdk": "1.10.2" | ||
}, | ||
@@ -82,0 +82,0 @@ "overrides": { |
106
README.md
# @descope/user-management-widget | ||
## Setup | ||
### Create an `.env` file | ||
In the widget package create an `.env` file which includes; | ||
``` | ||
DESCOPE_BASE_URL= # env base url | ||
DESCOPE_PROJECT_ID= # project ID | ||
DESCOPE_TENANT= # tenant ID | ||
DESCOPE_WIDGET_ID= # default: user-management-widget | ||
``` | ||
### Authenticate | ||
Use the DescopeWC in this package's `index.html`. Comment out the widget web-component from `index.html` and paste this: | ||
``` | ||
<script src="https://cdn.jsdelivr.net/npm/@descope/web-component@latest/dist/index.min.js"></script> | ||
<descope-wc | ||
project-id="<project-id>" | ||
flow-id="<flow-id>" | ||
base-url="<base-url>" | ||
></descope-wc> | ||
``` | ||
### Start the widget | ||
run `npm start` to load the widget. | ||
After authentication, comment out DescopeWC and remove restore the widget's web-component in `index.html`. | ||
The widget should now run. | ||
## Architecture | ||
## Project Sturcture | ||
- `/app` - contains `index.html` | ||
- `/lib` - widget's source code | ||
- `lib/mixins` - generic mixins (shared logic to reuse by other widgets) | ||
- `lib/widget` - widget related implementations | ||
- `lib/widget/api` - Logic related to API calls | ||
- `lib/widget/drivers` - An SDK for component interaction | ||
- `lib/widget/mixins` - Widget specific logic | ||
- `lib/widget/state` - State managment logic | ||
### API | ||
--- | ||
### Mixins | ||
The widget is composed of mixins, each mixin contains specific logic parts, and sometime exposes an API that can be used in other mixins. | ||
Mixins can be composed on top of each other, so we can create new mixins by composing several mixins together. | ||
#### Mixins Creators | ||
Functions that create mixins, can get a configuration, and returns the mixin functions. | ||
#### Singleton Mixin | ||
Since mixins are composeable, in some cases we want to make sure a mixin is loaded only once. For example: When there is no need for its logic to run multiple times when composed in different mixins. | ||
For this case we have a wrapper function (`createSingletonMixin`) to ensure that a mixin is loaded only once, regardless how many times it will be composed. | ||
Mixins should be wrapped with the `createSingletonMixin` wrapper function, unless there is a reason for running the mixin's logic multiple times. | ||
### State | ||
We're using several tools to handle the widget's state: | ||
- [Redux Toolkit](https://redux-toolkit.js.org/) for the widget's state managment. | ||
- [Redux Thunk](https://github.com/reduxjs/redux-thunk) for API calls and async operations we're using | ||
- [Reselect](https://github.com/reduxjs/reselect) to compute derived data without hitting performence or triggering state recalculation when state is not mutated. | ||
### Drivers | ||
An abstraction layer that provides an API for components, and enables handling interactions with components within the widget. | ||
The motiviation 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 implenentation 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 |
Sorry, the diff of this file is too big to display
674693
108
+ Added@descope/core-js-sdk@2.11.1(transitive)
+ Added@descope/web-js-sdk@1.10.2(transitive)
- Removed@descope/core-js-sdk@2.11.0(transitive)
- Removed@descope/web-js-sdk@1.10.1(transitive)
Updated@descope/web-js-sdk@1.10.2