@descope/access-key-management-widget 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Descope <help@descope.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,107 @@
+# @descope/access-key-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: access-key-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

package/dist/esm/index.js

@@ -0,0 +1,6 @@
+
+      /**
+       * @descope/access-key-management-widget v0.1.0
+       */
+      import{pluralize as e,createSingletonMixin as t,compose as s,createTemplate as i,withMemCache as a,debounce as o}from"@descope/sdk-helpers";import{__awaiter as c,__classPrivateFieldGet as n,__classPrivateFieldSet as d}from"tslib";import{projectIdMixin as r,observeAttributesMixin as l,loggerMixin as u,createValidateAttributesMixin as h,createStateManagementMixin as v,initLifecycleMixin as g,staticResourcesMixin as y,descopeUiMixin as m,initElementMixin as p,modalMixin as f,formMixin as R,notificationsMixin as w,debuggerMixin as K,themeMixin as b}from"@descope/sdk-mixins";import{GridDriver as k,ButtonDriver as M,TextDriver as A,MultiSelectDriver as W,TextFieldDriver as C}from"@descope/sdk-component-drivers";import{createSelector as x}from"reselect";import{createAsyncThunk as S}from"@reduxjs/toolkit";import j from"@descope/web-js-sdk";const $=e=>e.selectedAccessKeysIds,O=e=>e.notifications,L=x((e=>e.accessKeysList.data),(e=>e.map((e=>Object.assign(Object.assign({},e),{expireTimeFormatted:(null==e?void 0:e.expireTime)?new Date(1e3*((null==e?void 0:e.expireTime)||0)).toLocaleString():"Never",status:(null==e?void 0:e.expireTime)&&new Date(1e3*((null==e?void 0:e.expireTime)||0))<new Date?"expired":null==e?void 0:e.status}))))),P=x($,L,((e,t)=>t.filter((t=>e.includes(t.id)))));x($,(e=>!!e.length));const D=x(P,(e=>e.every((e=>e.editable))));x($,(e=>1===e.length));const T=x(P,(e=>1===e.length?e[0].name:`${e.length} access keys`)),B=e=>(...t)=>s=>{s.addCase(e.pending,((e,s)=>{t.forEach((({onPending:t})=>{null==t||t(e,s)}))})),s.addCase(e.fulfilled,((e,s)=>{t.forEach((({onFulfilled:t})=>{null==t||t(e,s)}))})),s.addCase(e.rejected,((e,s)=>{t.forEach((({onRejected:t})=>{null==t||t(e,s)}))}))},F=e=>({onFulfilled:t=>{e(t).loading=!1},onPending:t=>{e(t).loading=!0,e(t).error=null},onRejected:(t,s)=>{e(t).loading=!1,e(t).error=s.error}}),I=({getErrorMsg:e,getSuccessMsg:t})=>({onFulfilled:(e,s)=>{t&&e.notifications.push({type:"success",msg:t(s)})},onRejected:(t,s)=>{e&&t.notifications.push({type:"error",msg:e(s)})}}),q=S("accessKeys/create",((e,{extra:{api:t}})=>t.accesskey.create(e))),E=B(q)({onFulfilled:(e,t)=>{e.accessKeysList.data.unshift(t.payload.key)}},F((e=>e.createAccessKey)),I({getSuccessMsg:()=>"Access Key created successfully",getErrorMsg:e=>{var t;return`\n      <div>\n        <div>Failed to create access key</div>\n        ${null===(t=e.error)||void 0===t?void 0:t.message}\n      </div>`}})),N={action:q,reducer:E},H=S("accessKeys/delete",((e,{extra:{api:t}})=>t.accesskey.deleteBatch(e))),U=B(H)({onFulfilled:(e,t)=>{e.accessKeysList.data=e.accessKeysList.data.filter((e=>!t.meta.arg.includes(e.id))),e.selectedAccessKeysIds=[]}},F((e=>e.deleteAccessKey)),I({getSuccessMsg:t=>e(t.meta.arg.length)`${["",t.meta.arg.length]} ${["A","a"]}ccess key${["","s"]} deleted successfully`,getErrorMsg:t=>e(t.meta.arg.length)`Failed to delete access key${["","s"]}`})),Z={action:H,reducer:U},V=S("accessKeys/search",((e,{extra:{api:t},getState:s})=>{const i=s().searchParams;return t.accesskey.search(Object.assign(Object.assign({},i),e))})),z=B(V)({onPending:(e,t)=>{e.searchParams=Object.assign(Object.assign({},e.searchParams),t.meta.arg)},onFulfilled:(e,t)=>{e.accessKeysList.data=t.payload}},F((e=>e.accessKeysList))),J={action:V,reducer:z},G=S("accessKeys/activate",((e,{extra:{api:t}})=>t.accesskey.activate(e))),Q=B(G)({onFulfilled:(e,t)=>{e.accessKeysList.data.forEach((e=>{t.meta.arg.includes(e.id)&&(e.status="active")}))}},F((e=>e.activateAccessKey)),I({getSuccessMsg:t=>e(t.meta.arg.length)`${["",t.meta.arg.length]} ${["A","a"]}ccess key${["","s"]} activated successfully`,getErrorMsg:t=>e(t.meta.arg.length)`Failed to activate access key${["","s"]}`})),X={action:G,reducer:Q},Y=S("accessKeys/deactivate",((e,{extra:{api:t}})=>t.accesskey.deactivate(e))),_=B(Y)({onFulfilled:(e,t)=>{e.accessKeysList.data.forEach((e=>{t.meta.arg.includes(e.id)&&(e.status="inactive")}))}},F((e=>e.deactivateAccessKey)),I({getSuccessMsg:t=>e(t.meta.arg.length)`${["",t.meta.arg.length]} ${["A","a"]}ccess key${["","s"]} deactivated successfully`,getErrorMsg:t=>e(t.meta.arg.length)`Failed to deactivate access key${["","s"]}`})),ee={action:Y,reducer:_},te=S("tenant/getTenantRoles",((e,{extra:{api:t}})=>t.tenant.getTenantRoles())),se={action:te,reducer:B(te)({onFulfilled:(e,t)=>{e.tenantRoles.data=t.payload.roles}},F((e=>e.tenantRoles)))},ie={accessKeysList:{data:[],loading:!1,error:null},createAccessKey:{loading:!1,error:null},activateAccessKey:{loading:!1,error:null},deactivateAccessKey:{loading:!1,error:null},deleteAccessKey:{loading:!1,error:null},tenantRoles:{loading:!1,error:null,data:[]},searchParams:{text:"",sort:[]},selectedAccessKeysIds:[],notifications:[]},ae={search:"/v1/mgmt/accesskey/search",deleteBatch:"/v1/mgmt/accesskey/delete/batch",create:"/v1/mgmt/accesskey/create",deactivate:"/v1/mgmt/accesskey/deactivate/batch",activate:"/v1/mgmt/accesskey/activate/batch"},oe={roles:"/v1/mgmt/role/all"},ce=e=>c(void 0,void 0,void 0,(function*(){const t=yield e.text(),s=JSON.parse(t);if(!e.ok){const t=`${s.errorDescription}${s.errorMessage?`: ${s.errorMessage}`:""}`;throw Error(t||`${e.status} ${e.statusText}`)}e.json=()=>Promise.resolve(s),e.text=()=>Promise.resolve(t)})),ne=({text:e,sort:t}={})=>c(void 0,void 0,void 0,(function*(){return new Promise((s=>{const i=[];for(let e=1;e<9;e+=1)i.push({id:`access-key-id-${e}`,name:`Access Key ${e}`,createdBy:`User ${e}`,editable:!0,expireTime:(new Date).getTime()/1e3+2592e3,createdTime:new Date,roleNames:[`Role ${e}`],status:"active",clientId:`Client ID ${e}`});t.forEach((e=>{i.sort(((t,s)=>{var i,a;return e.desc?null===(a=s[e.field])||void 0===a?void 0:a.localeCompare(t[e.field]):null===(i=t[e.field])||void 0===i?void 0:i.localeCompare(s[e.field])}))})),s(i.filter((t=>t.name.toLowerCase().includes(e.toLowerCase())||t.createdBy.toLowerCase().includes(e.toLowerCase()))))}))})),de=({name:e,roleNames:t,userId:s},i)=>c(void 0,void 0,void 0,(function*(){const a=Math.random().toString(10).substring(15);return new Promise((o=>{o({cleartext:Math.random().toString(20).substring(2),key:{id:`access-key-id-${a}`,name:e||`Access Key ${a}`,createdBy:s||`User ${a}`,editable:!0,expireTime:i,createdTime:new Date,roleNames:t,status:"active",clientId:`Client ID ${a}`}})}))})),re=()=>c(void 0,void 0,void 0,(function*(){})),le=()=>c(void 0,void 0,void 0,(function*(){})),ue=()=>c(void 0,void 0,void 0,(function*(){})),he=e=>new Promise((t=>{const s=[];for(let t=1;t<5;t+=1)s.push({name:`Role ${t}`,description:`Role description ${t}`,createdTime:new Date,permissionNames:[`Permission ${t}`],tenantId:e});t({roles:s})})),ve=({httpClient:e,tenant:t,mock:s})=>({search:({page:i,limit:a=1e4,text:o,sort:n}={})=>c(void 0,void 0,void 0,(function*(){if(s)return ne({page:i,limit:a,text:o,sort:n});const c=yield e.post(ae.search,{limit:a,page:i,text:o,sort:n},{queryParams:{tenant:t}});yield ce(c);return(yield c.json()).keys})),deleteBatch:i=>c(void 0,void 0,void 0,(function*(){if(s)return ue();const a=yield e.post(ae.deleteBatch,{ids:i},{queryParams:{tenant:t}});return yield ce(a),a.json()})),create:({name:i,expiration:a,roleNames:o,userId:n})=>c(void 0,void 0,void 0,(function*(){const c=new Date;c.setDate(c.getDate()+ +a);const d="0"===a[0]?0:Math.floor(c.getTime()/1e3);if(s)return de({name:i,expiration:a,roleNames:o,userId:n},d);const r=yield e.post(ae.create,{name:i,expireTime:d,roleNames:o,userId:n},{queryParams:{tenant:t}});yield ce(r);return yield r.json()})),activate:i=>c(void 0,void 0,void 0,(function*(){if(s)return re();const a=yield e.post(ae.activate,{ids:i},{queryParams:{tenant:t}});yield ce(a);return yield a.json()})),deactivate:i=>c(void 0,void 0,void 0,(function*(){if(s)return le();const a=yield e.post(ae.deactivate,{ids:i},{queryParams:{tenant:t}});yield ce(a);return yield a.json()}))}),ge=({httpClient:e,tenant:t,mock:s})=>({getTenantRoles:()=>c(void 0,void 0,void 0,(function*(){if(s)return he(t);const i=yield e.get(oe.roles,{queryParams:{tenant:t}});return yield ce(i),i.json()}))}),ye=t((e=>{var t,i,a,o;const v=s(r,l,u,h({tenant:h.missingAttrValidator}))(e);return o=class extends v{constructor(){super(...arguments),t.add(this),i.set(this,void 0)}get baseUrl(){return this.getAttribute("base-url")}get tenant(){return this.getAttribute("tenant")}get mock(){return this.getAttribute("mock")}get api(){return n(this,i,"f")||n(this,t,"m",a).call(this),n(this,i,"f")}init(){const e=Object.create(null,{init:{get:()=>super.init}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.init)||void 0===s?void 0:s.call(this),this.observeAttributes(["project-id","base-url","tenant"],(()=>{n(this,i,"f")&&n(this,t,"m",a).call(this)}))}))}},i=new WeakMap,t=new WeakSet,a=function(){this.logger.debug("creating an sdk instance"),d(this,i,((e,t,s)=>{const i=j(Object.assign(Object.assign({},e),{persistTokens:!0}));return{accesskey:ve({httpClient:i.httpClient,tenant:t,mock:s}),tenant:ge({httpClient:i.httpClient,tenant:t,mock:s})}})({projectId:this.projectId,baseUrl:this.baseUrl},this.tenant,"true"===this.mock),"f")},o})),me=t((e=>{const t=s(v({name:"widget",initialState:ie,reducers:{setSelectedAccessKeysIds:(e,{payload:t})=>{e.selectedAccessKeysIds=t},clearNotifications:e=>{e.notifications=[]}},extraReducers:e=>{N.reducer(e),Z.reducer(e),J.reducer(e),X.reducer(e),ee.reducer(e),se.reducer(e)},asyncActions:{searchAccessKeys:J.action,createAccessKey:N.action,activateAccessKeys:X.action,deactivateAccessKeys:ee.action,deleteAccessKeys:Z.action,getTenantRoles:se.action}}),g,u,ye)(e);return class extends t{constructor(...e){super(...e),this.state=ie,this.subscribe((e=>{this.logger.debug("State update:",e),this.state=e}))}}})),pe=t((e=>{const t=s(y,h({"widget-id":h.missingAttrValidator}))(e);return class extends t{get widgetId(){return this.getAttribute("widget-id")}fetchWidgetPage(e){return c(this,void 0,void 0,(function*(){return(yield this.fetchStaticResource(`access-key-management-widget/${this.widgetId}/${e}`,"text")).body}))}}})),fe=t((e=>{var t,a,o;return o=class extends(s(u,g,m,p,pe,me)(e)){constructor(){super(...arguments),t.add(this)}onWidgetRootReady(){return c(this,void 0,void 0,(function*(){}))}init(){const e=Object.create(null,{init:{get:()=>super.init}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.init)||void 0===s?void 0:s.call(this),yield Promise.all([n(this,t,"m",a).call(this),this.actions.searchAccessKeys(),this.actions.getTenantRoles()]),this.onWidgetRootReady()}))}},t=new WeakSet,a=function(){return c(this,void 0,void 0,(function*(){const e=i(yield this.fetchWidgetPage("root.html"));yield this.loadDescopeUiComponents(e),this.contentRootElement.append(e.content.cloneNode(!0))}))},o})),Re=t((e=>{var t,i,d,r,l;return l=class extends(s(me,u,fe)(e)){constructor(){super(...arguments),t.add(this),d.set(this,a((e=>{this.accessKeysTable.data=e}))),r.set(this,o(((e,t)=>{const s=[],{value:i}=t;if(i){const t=e.path;s.push({field:t,desc:"desc"===i})}this.actions.searchAccessKeys({sort:s})})))}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",i).call(this),this.accessKeysTable.columns.forEach((e=>{e.onSortDirectionChange((e=>{n(this,r,"f").call(this,e.target,e.detail)}))})),n(this,d,"f").call(this,L(this.state)),this.subscribe(n(this,d,"f").bind(this),L)}))}},d=new WeakMap,r=new WeakMap,t=new WeakSet,i=function(){var e;this.accessKeysTable=new k(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="access-keys-table"]'),{logger:this.logger}),this.accessKeysTable.onSelectedItemsChange((e=>{this.actions.setSelectedAccessKeysIds(e.detail.value.map((({id:e})=>e)))}))},l})),we=t((e=>{var t,a,o;return o=class extends(s(me,f,u,fe)(e)){constructor(){super(...arguments),t.add(this)}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),yield n(this,t,"m",a).call(this)}))}},t=new WeakSet,a=function(){var e;return c(this,void 0,void 0,(function*(){this.activateAccessKeysModal=this.createModal(),this.activateAccessKeysModal.setContent(i(yield this.fetchWidgetPage("activate-access-keys-modal.html")));const t=new M((()=>{var e;return null===(e=this.activateAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-cancel"]')}),{logger:this.logger});t.onClick((()=>this.activateAccessKeysModal.close()));const s=new M((()=>{var e;return null===(e=this.activateAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-submit"]')}),{logger:this.logger});s.onClick((()=>{const e=P(this.state);this.actions.activateAccessKeys(null==e?void 0:e.map((e=>e.id))),this.activateAccessKeysModal.close()}));const a=new A(null===(e=this.activateAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="body-text"]'),{logger:this.logger});this.activateAccessKeysModal.beforeOpen=()=>{const e=T(this.state);a.text=`Activate ${e}?`}}))},o})),Ke=t((e=>{var t,i,o,d;return d=class extends(s(u,fe,me,we)(e)){constructor(){super(...arguments),t.add(this),o.set(this,a((e=>{e?this.activateButton.enable():this.activateButton.disable()})))}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",i).call(this),this.subscribe(n(this,o,"f").bind(this),D)}))}},o=new WeakMap,t=new WeakSet,i=function(){var e;this.activateButton=new M(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="activate-access-keys"]'),{logger:this.logger}),this.activateButton.disable(),this.activateButton.onClick((()=>{this.activateAccessKeysModal.open()}))},d})),be=t((e=>{var t,a,o;return o=class extends(s(me,f,R,u,fe)(e)){constructor(){super(...arguments),t.add(this)}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",a).call(this)}))}},t=new WeakSet,a=function(){return c(this,void 0,void 0,(function*(){this.createdAccessKeyModal=this.createModal(),this.createdAccessKeyModal.setContent(i(yield this.fetchWidgetPage("created-access-key-modal.html")));const e=new M((()=>{var e;return null===(e=this.createdAccessKeyModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-close"]')}),{logger:this.logger});e.onClick((()=>{navigator.clipboard.writeText(this.getFormData(this.createdAccessKeyModal.ele)["generated-key"]),this.resetFormData(this.createdAccessKeyModal.ele),this.createdAccessKeyModal.close()}))}))},o})),ke=t((e=>{var t,a,o,r,l;return l=class extends(s(me,f,R,u,fe,be)(e)){constructor(){super(...arguments),t.add(this),a.set(this,void 0),r.set(this,(()=>c(this,void 0,void 0,(function*(){var e,t;yield n(this,a,"f").setData(null===(t=this.state,e=t.tenantRoles.data||[])||void 0===e?void 0:e.map((({name:e})=>({value:e,label:e}))))}))))}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",o).call(this)}))}},a=new WeakMap,r=new WeakMap,t=new WeakSet,o=function e(){return c(this,void 0,void 0,(function*(){this.createAccessKeyModal=this.createModal(),this.createAccessKeyModal.setContent(i(yield this.fetchWidgetPage("create-access-key-modal.html")));const s=new M((()=>{var e;return null===(e=this.createAccessKeyModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-cancel"]')}),{logger:this.logger});s.onClick((()=>{this.createAccessKeyModal.close(),this.resetFormData(this.createAccessKeyModal.ele)}));const o=new M((()=>{var e;return null===(e=this.createAccessKeyModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-submit"]')}),{logger:this.logger});o.onClick((()=>c(this,void 0,void 0,(function*(){var e;if(this.validateForm(this.createAccessKeyModal.ele)){const t=yield this.actions.createAccessKey(Object.assign({},this.getFormData(this.createAccessKeyModal.ele)));this.createAccessKeyModal.close(),this.setFormData(this.createdAccessKeyModal.ele,{"generated-key":null===(e=null==t?void 0:t.payload)||void 0===e?void 0:e.cleartext}),this.createdAccessKeyModal.open()}})))),d(this,a,new W((()=>{var e;return null===(e=this.createAccessKeyModal.ele)||void 0===e?void 0:e.querySelector('[data-id="roles-multiselect"]')}),{logger:this.logger}),"f"),n(this,r,"f").call(this),this.createAccessKeyModal.afterClose=()=>{n(this,t,"m",e).call(this)}}))},l})),Me=t((e=>{var t,i,a;return a=class extends(s(u,ke,fe)(e)){constructor(){super(...arguments),t.add(this)}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",i).call(this)}))}},t=new WeakSet,i=function(){var e;this.createButton=new M(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="create-access-key"]'),{logger:this.logger}),this.createButton.onClick((()=>this.createAccessKeyModal.open()))},a})),Ae=t((e=>{var t,a,o;return o=class extends(s(me,f,u,fe)(e)){constructor(){super(...arguments),t.add(this)}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),yield n(this,t,"m",a).call(this)}))}},t=new WeakSet,a=function(){var e;return c(this,void 0,void 0,(function*(){this.deactivateAccessKeysModal=this.createModal(),this.deactivateAccessKeysModal.setContent(i(yield this.fetchWidgetPage("deactivate-access-keys-modal.html")));const t=new M((()=>{var e;return null===(e=this.deactivateAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-cancel"]')}),{logger:this.logger});t.onClick((()=>this.deactivateAccessKeysModal.close()));const s=new M((()=>{var e;return null===(e=this.deactivateAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-submit"]')}),{logger:this.logger});s.onClick((()=>{const e=P(this.state);this.actions.deactivateAccessKeys(null==e?void 0:e.map((e=>e.id))),this.deactivateAccessKeysModal.close()}));const a=new A(null===(e=this.deactivateAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="body-text"]'),{logger:this.logger});this.deactivateAccessKeysModal.beforeOpen=()=>{const e=T(this.state);a.text=`Deactivate ${e}?`}}))},o})),We=t((e=>{var t,i,o,d;return d=class extends(s(u,fe,me,Ae)(e)){constructor(){super(...arguments),t.add(this),o.set(this,a((e=>{e?this.deactivateButton.enable():this.deactivateButton.disable()})))}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",i).call(this),this.subscribe(n(this,o,"f").bind(this),D)}))}},o=new WeakMap,t=new WeakSet,i=function(){var e;this.deactivateButton=new M(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="deactivate-access-keys"]'),{logger:this.logger}),this.deactivateButton.disable(),this.deactivateButton.onClick((()=>{this.deactivateAccessKeysModal.open()}))},d})),Ce=t((e=>{var t,a,o;return o=class extends(s(me,f,u,fe)(e)){constructor(){super(...arguments),t.add(this)}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),yield n(this,t,"m",a).call(this)}))}},t=new WeakSet,a=function(){var e;return c(this,void 0,void 0,(function*(){this.deleteAccessKeysModal=this.createModal(),this.deleteAccessKeysModal.setContent(i(yield this.fetchWidgetPage("delete-access-keys-modal.html")));const t=new M((()=>{var e;return null===(e=this.deleteAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-cancel"]')}),{logger:this.logger});t.onClick((()=>this.deleteAccessKeysModal.close()));const s=new M((()=>{var e;return null===(e=this.deleteAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="modal-submit"]')}),{logger:this.logger});s.onClick((()=>{const e=P(this.state);this.actions.deleteAccessKeys(null==e?void 0:e.map((e=>e.id))),this.deleteAccessKeysModal.close()}));const a=new A(null===(e=this.deleteAccessKeysModal.ele)||void 0===e?void 0:e.querySelector('[data-id="body-text"]'),{logger:this.logger});this.deleteAccessKeysModal.beforeOpen=()=>{const e=T(this.state);a.text=`Delete ${e}?`}}))},o})),xe=t((e=>{var t,i,o,d;return d=class extends(s(u,fe,me,Ce)(e)){constructor(){super(...arguments),t.add(this),o.set(this,a((e=>{e?this.deleteButton.enable():this.deleteButton.disable()})))}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",i).call(this),this.subscribe(n(this,o,"f").bind(this),D)}))}},o=new WeakMap,t=new WeakSet,i=function(){var e;this.deleteButton=new M(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="delete-access-keys"]'),{logger:this.logger}),this.deleteButton.disable(),this.deleteButton.onClick((()=>{this.deleteAccessKeysModal.open()}))},d})),Se=t((e=>{var t,i,a,d;return d=class extends(s(u,fe,me)(e)){constructor(){super(...arguments),t.add(this),i.set(this,o((()=>{this.actions.searchAccessKeys({text:this.searchInput.value})})))}onWidgetRootReady(){const e=Object.create(null,{onWidgetRootReady:{get:()=>super.onWidgetRootReady}});var s;return c(this,void 0,void 0,(function*(){yield null===(s=e.onWidgetRootReady)||void 0===s?void 0:s.call(this),n(this,t,"m",a).call(this)}))}},i=new WeakMap,t=new WeakSet,a=function(){var e;this.searchInput=new C(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector('[data-id="search-input"]'),{logger:this.logger}),this.searchInput.onInput(n(this,i,"f"))},d}));const je={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},$e=t((e=>{var t,i,o,d,r;return r=class extends(s(u,me,w,g)(e)){constructor(){super(...arguments),t.add(this),d.set(this,a((e=>{e.length&&(e.forEach((({type:e,msg:s})=>{const a=n(this,t,"m",o).call(this,e);a.setContent(n(this,t,"m",i).call(this,{type:e,msg:s})),a.show()})),setTimeout((()=>this.actions.clearNotifications())))})))}init(){const e=Object.create(null,{init:{get:()=>super.init}});var t;return c(this,void 0,void 0,(function*(){yield null===(t=e.init)||void 0===t?void 0:t.call(this),this.subscribe(n(this,d,"f").bind(this),O)}))}},d=new WeakMap,t=new WeakSet,i=function({type:e,msg:t}){const s=je[e],i=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==s?void 0:s.outerHTML)||""}${t}${i.outerHTML}`},o=function(e){return this.createNotification({mode:e,duration:"error"===e?0:3e3,position:"bottom-start",size:"sm"})},r})),Oe=t((e=>class extends(s(K,b,Re,Me,xe,Se,Ke,We,$e)(e)){init(){const e=Object.create(null,{init:{get:()=>super.init}});var t;return c(this,void 0,void 0,(function*(){yield null===(t=e.init)||void 0===t?void 0:t.call(this)}))}})),Le=s((e=>class extends(Oe(e)){}))(HTMLElement);customElements.define("descope-access-key-management-widget",Le);export{Le as default};
+//# sourceMappingURL=index.js.map