UNPKG

@nopwdio/sdk-js

Version:
35 lines (27 loc) 3.11 kB
import{b as f}from"../chunk-MI4LMNWM.js";import{d as m,f as d,i as u,j as h}from"../chunk-PJMUNIPM.js";import{a as l,b as p}from"../chunk-325E7D5T.js";import{a as i,b as o,d as s,e as c,f as a}from"../chunk-X5RZB7NH.js";import{a as E}from"../chunk-4DGRMKHT.js";import"../chunk-XGY7T5A3.js";import"../chunk-VS4C5FIV.js";import{a as b}from"../chunk-EX74VC7J.js";import{a as n}from"../chunk-JFKSI6I7.js";var g=i` :host { display: flex; } button { display: flex; flex-grow: 1; gap: var(--np-component-icon-gap); justify-content: center; align-items: center; margin: 0; padding: var(--np-component-padding); border: solid var(--np-component-border-color) var(--np-component-border-width); border-radius: var(--np-component-border-radius); font-size: var(--np-component-font-size); font-weight: var(--np-component-font-weight); color: var(--np-component-text-color); background-color: var(--np-component-background-color); } :host { --np-component-border-color: var(--np-core-color-black); --np-component-text-color: var(--np-core-color-white); --np-component-background-color: var(--np-core-color-black); } `;var v=(r=>(r.REGISTERING="registering",r.REGISTERED="registered",r.ERROR="error",r))(v||{}),e=class extends s{constructor(){super(...arguments);this.state=void 0;this.resetDuration=2e3;this.stateTimeoutId=null;this.abort=null}async connectedCallback(){super.connectedCallback()}async disconnectedCallback(){super.disconnectedCallback(),this.cancel()}async onClick(){return await this.register()}async register(){if(!this.state)try{let t=await f();if(!t)throw new Error("You must be authenticated to create a passkey");this.abort=new AbortController,this.state="registering";let{id:r}=await E(t.token,this.abort.signal);this.state="registered",this.dispatchRegisterEvent(r),this.resetState(this.resetDuration)}catch(t){if(t instanceof b)return this.resetState();this.state="error",this.dispatchErrorEvent(t),this.resetState(this.resetDuration)}finally{this.abort=null}}cancel(){this.abort&&(this.abort.abort(),this.abort=null),this.resetState()}resetState(t=0){return new Promise(r=>{this.stateTimeoutId&&(window.clearTimeout(this.stateTimeoutId),this.stateTimeoutId=null),this.stateTimeoutId=window.setTimeout(()=>{this.state=void 0},t)})}dispatchRegisterEvent(t){this.dispatchEvent(new CustomEvent("np:register",{composed:!0,cancelable:!0,bubbles:!0,detail:{kid:t}}))}dispatchErrorEvent(t){this.dispatchEvent(new CustomEvent("np:error",{composed:!0,cancelable:!0,bubbles:!0,detail:t}))}render(){return o`<button @click=${this.onClick} part="button"> ${this.state?this.state==="registering"?o`${u}<slot name="registering">Creating...</slot>`:this.state==="registered"?o`${m}<slot name="registered">Passkey created!</slot>`:o`${h}<slot name="error">Create a passkey</slot>`:o`${d}<slot>Create a passkey</slot>`} </button>`}};e.styles=[l,p,g],n([a({reflect:!0})],e.prototype,"state",2),n([a({type:Number})],e.prototype,"resetDuration",2),e=n([c("np-passkey-register")],e);export{e as NpPasskeyRegister,v as State};