@wral/studio.mods.auth 2.0.0 → 2.0.1

package/dist/auth.cjs.js

@@ -186,7 +186,7 @@
 				font-weight: bold;
 				font-style: normal;
 			}
-		`}static get states(){return{DEFAULT:"DEFAULT",FORGOT:"FORGOT",CHALLENGE_CHANGE_PW:"CHALLENGE_CHANGE_PW"}}constructor(){super(),this.formState=this.constructor.states.DEFAULT,this.errors=[],this.isBusy=!1}login({username:e,password:t}){return N({baseUrl:this.api}).mintToken({username:e,password:t})}emitLoginSuccess(e){this.dispatchEvent(new CustomEvent("login-success",{detail:{token:e},bubbles:!0,composed:!0,cancelable:!0}))}handleSubmitLogin(e){e.preventDefault();const t=e.explicitOriginalTarget.parentElement,s=new FormData(t).entries().reduce((o,[i,n])=>(o[i]=n,o),{});this.isBusy=!0,this.errors=[],this.requestUpdate(),this.login(s).then(({token:o,challenge:i})=>{if((i==null?void 0:i.name)==="NEW_PASSWORD_REQUIRED"){this.token=o,this.username=s.username,this.password=s.password,this.setState(this.constructor.states.CHALLENGE_CHANGE_PW);return}this.emitLoginSuccess(o)}).catch(o=>{console.error(o),this.errors=[o.message],this.requestUpdate()})}onSubmitChangePasswordChallenge(e){e.preventDefault();const t=e.explicitOriginalTarget.parentElement,s=new FormData(t).entries().reduce((l,[a,d])=>(l[a]=d,l),{}),o=s.password,i=s["confirm-password"];if(o!==i){this.errors=["Passwords do not match"],this.requestUpdate();return}N({baseUrl:this.api}).updatePassword({token:this.token,currentPassword:this.password,newPassword:o}).then(()=>{this.emitLoginSuccess(this.token)}).catch(l=>{console.error(l),this.errors=[l.message],this.requestUpdate()})}setState(e){this.formState=e,this.isBusy=!1,this.errors=[],this.requestUpdate()}render(){return p`<div class="login-form">
+		`}static get states(){return{DEFAULT:"DEFAULT",FORGOT:"FORGOT",CHALLENGE_CHANGE_PW:"CHALLENGE_CHANGE_PW"}}constructor(){super(),this.formState=this.constructor.states.DEFAULT,this.errors=[],this.isBusy=!1}login({username:e,password:t}){return N({baseUrl:this.api}).mintToken({username:e,password:t})}emitLoginSuccess(e){this.dispatchEvent(new CustomEvent("login-success",{detail:{token:e},bubbles:!0,composed:!0,cancelable:!0}))}handleSubmitLogin(e){e.preventDefault();const t=e.currentTarget,s=new FormData(t).entries().reduce((o,[i,n])=>(o[i]=n,o),{});this.isBusy=!0,this.errors=[],this.requestUpdate(),this.login(s).then(({token:o,challenge:i})=>{if((i==null?void 0:i.name)==="NEW_PASSWORD_REQUIRED"){this.token=o,this.username=s.username,this.password=s.password,this.setState(this.constructor.states.CHALLENGE_CHANGE_PW);return}this.emitLoginSuccess(o)}).catch(o=>{console.error(o),this.errors=[o.message],this.requestUpdate()})}onSubmitChangePasswordChallenge(e){e.preventDefault();const t=e.currentTarget,s=new FormData(t).entries().reduce((l,[a,d])=>(l[a]=d,l),{}),o=s.password,i=s["confirm-password"];if(o!==i){this.errors=["Passwords do not match"],this.requestUpdate();return}N({baseUrl:this.api}).updatePassword({token:this.token,currentPassword:this.password,newPassword:o}).then(()=>{this.emitLoginSuccess(this.token)}).catch(l=>{console.error(l),this.errors=[l.message],this.requestUpdate()})}setState(e){this.formState=e,this.isBusy=!1,this.errors=[],this.requestUpdate()}render(){return p`<div class="login-form">
 			${this.renderHeader()}
 			${this.formState===this.constructor.states.DEFAULT?this.renderLoginForm():""}
 			${this.formState===this.constructor.states.CHALLENGE_CHANGE_PW?this.renderChangePasswordForm():""}
@@ -195,7 +195,7 @@
 			<div class="intro">Welcome to</div>
 			<div class="brand"><em>WRAL</em>.studio</div>
 		</div>`}renderLoginForm(){return p`
-			<form>
+			<form @submit=${this.handleSubmitLogin}>
 				<label for="username">User</label>
 				<input
 					type="text"
@@ -217,7 +217,7 @@
 				</div>
 				${this.errors?this.errors.map(e=>p`<p class="error">${e}</p>`):""}
 
-				<input type="submit" value="Log in" @click=${this.handleSubmitLogin}
+				<input type="submit" value="Log in"
 					?disabled=${this.isBusy}
 				/>
 			</form>

package/dist/auth.es.js

@@ -280,7 +280,7 @@ S.elementStyles = [], S.shadowRootOptions = { mode: "open" }, S[U("elementProper
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const T = globalThis, M = T.trustedTypes, ee = M ? M.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, he = "$lit$", g = `lit$${Math.random().toFixed(9).slice(2)}$`, ce = "?" + g, Se = `<${ce}>`, A = document, k = () => A.createComment(""), O = (r) => r === null || typeof r != "object" && typeof r != "function", Q = Array.isArray, Ce = (r) => Q(r) || typeof (r == null ? void 0 : r[Symbol.iterator]) == "function", z = `[ 	
+const T = globalThis, M = T.trustedTypes, ee = M ? M.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, he = "$lit$", g = `lit$${Math.random().toFixed(9).slice(2)}$`, ce = "?" + g, Se = `<${ce}>`, A = document, k = () => A.createComment(""), R = (r) => r === null || typeof r != "object" && typeof r != "function", Q = Array.isArray, Ce = (r) => Q(r) || typeof (r == null ? void 0 : r[Symbol.iterator]) == "function", z = `[ 	
 \f\r]`, x = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, te = /-->/g, se = />/g, b = RegExp(`>|${z}(?:([^\\s"'>=/]+)(${z}*=${z}*(?:[^ 	
 \f\r"'\`<>=]|("|')|))|$)`, "g"), re = /'/g, oe = /"/g, de = /^(?:script|style|textarea|title)$/i, Pe = (r) => (e, ...t) => ({ _$litType$: r, strings: e, values: t }), p = Pe(1), C = Symbol.for("lit-noChange"), u = Symbol.for("lit-nothing"), ie = /* @__PURE__ */ new WeakMap(), w = A.createTreeWalker(A, 129);
 function ue(r, e) {
@@ -299,13 +299,13 @@ const xe = (r, e) => {
   }
   return [ue(r, i + (r[t] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), s];
 };
-class R {
+class O {
   constructor({ strings: e, _$litType$: t }, s) {
     let o;
     this.parts = [];
     let i = 0, n = 0;
     const l = e.length - 1, a = this.parts, [d, h] = xe(e, t);
-    if (this.el = R.createElement(d, s), w.currentNode = this.el.content, t === 2 || t === 3) {
+    if (this.el = O.createElement(d, s), w.currentNode = this.el.content, t === 2 || t === 3) {
       const c = this.el.content.firstChild;
       c.replaceWith(...c.childNodes);
     }
@@ -313,7 +313,7 @@ class R {
       if (o.nodeType === 1) {
         if (o.hasAttributes()) for (const c of o.getAttributeNames()) if (c.endsWith(he)) {
           const m = h[n++], f = o.getAttribute(c).split(g), y = /([.?@])?(.*)/.exec(m);
-          a.push({ type: 1, index: i, name: y[2], strings: f, ctor: y[1] === "." ? Te : y[1] === "?" ? ke : y[1] === "@" ? Oe : D }), o.removeAttribute(c);
+          a.push({ type: 1, index: i, name: y[2], strings: f, ctor: y[1] === "." ? Te : y[1] === "?" ? ke : y[1] === "@" ? Re : D }), o.removeAttribute(c);
         } else c.startsWith(g) && (a.push({ type: 6, index: i }), o.removeAttribute(c));
         if (de.test(o.tagName)) {
           const c = o.textContent.split(g), m = c.length - 1;
@@ -340,7 +340,7 @@ function P(r, e, t = r, s) {
   var n, l;
   if (e === C) return e;
   let o = s !== void 0 ? (n = t._$Co) == null ? void 0 : n[s] : t._$Cl;
-  const i = O(e) ? void 0 : e._$litDirective$;
+  const i = R(e) ? void 0 : e._$litDirective$;
   return (o == null ? void 0 : o.constructor) !== i && ((l = o == null ? void 0 : o._$AO) == null || l.call(o, !1), i === void 0 ? o = void 0 : (o = new i(r), o._$AT(r, t, s)), s !== void 0 ? (t._$Co ?? (t._$Co = []))[s] = o : t._$Cl = o), o !== void 0 && (e = P(r, o._$AS(r, e.values), o, s)), e;
 }
 class Ue {
@@ -360,7 +360,7 @@ class Ue {
     for (; a !== void 0; ) {
       if (n === a.index) {
         let d;
-        a.type === 2 ? d = new H(i, i.nextSibling, this, e) : a.type === 1 ? d = new a.ctor(i, a.name, a.strings, this, e) : a.type === 6 && (d = new Re(i, this, e)), this._$AV.push(d), a = s[++l];
+        a.type === 2 ? d = new H(i, i.nextSibling, this, e) : a.type === 1 ? d = new a.ctor(i, a.name, a.strings, this, e) : a.type === 6 && (d = new Oe(i, this, e)), this._$AV.push(d), a = s[++l];
       }
       n !== (a == null ? void 0 : a.index) && (i = w.nextNode(), n++);
     }
@@ -391,7 +391,7 @@ class H {
     return this._$AB;
   }
   _$AI(e, t = this) {
-    e = P(this, e, t), O(e) ? e === u || e == null || e === "" ? (this._$AH !== u && this._$AR(), this._$AH = u) : e !== this._$AH && e !== C && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Ce(e) ? this.k(e) : this._(e);
+    e = P(this, e, t), R(e) ? e === u || e == null || e === "" ? (this._$AH !== u && this._$AR(), this._$AH = u) : e !== this._$AH && e !== C && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Ce(e) ? this.k(e) : this._(e);
   }
   O(e) {
     return this._$AA.parentNode.insertBefore(e, this._$AB);
@@ -400,11 +400,11 @@ class H {
     this._$AH !== e && (this._$AR(), this._$AH = this.O(e));
   }
   _(e) {
-    this._$AH !== u && O(this._$AH) ? this._$AA.nextSibling.data = e : this.T(A.createTextNode(e)), this._$AH = e;
+    this._$AH !== u && R(this._$AH) ? this._$AA.nextSibling.data = e : this.T(A.createTextNode(e)), this._$AH = e;
   }
   $(e) {
     var i;
-    const { values: t, _$litType$: s } = e, o = typeof s == "number" ? this._$AC(e) : (s.el === void 0 && (s.el = R.createElement(ue(s.h, s.h[0]), this.options)), s);
+    const { values: t, _$litType$: s } = e, o = typeof s == "number" ? this._$AC(e) : (s.el === void 0 && (s.el = O.createElement(ue(s.h, s.h[0]), this.options)), s);
     if (((i = this._$AH) == null ? void 0 : i._$AD) === o) this._$AH.p(t);
     else {
       const n = new Ue(o, this), l = n.u(this.options);
@@ -413,7 +413,7 @@ class H {
   }
   _$AC(e) {
     let t = ie.get(e.strings);
-    return t === void 0 && ie.set(e.strings, t = new R(e)), t;
+    return t === void 0 && ie.set(e.strings, t = new O(e)), t;
   }
   k(e) {
     Q(this._$AH) || (this._$AH = [], this._$AR());
@@ -447,11 +447,11 @@ class D {
   _$AI(e, t = this, s, o) {
     const i = this.strings;
     let n = !1;
-    if (i === void 0) e = P(this, e, t, 0), n = !O(e) || e !== this._$AH && e !== C, n && (this._$AH = e);
+    if (i === void 0) e = P(this, e, t, 0), n = !R(e) || e !== this._$AH && e !== C, n && (this._$AH = e);
     else {
       const l = e;
       let a, d;
-      for (e = i[0], a = 0; a < i.length - 1; a++) d = P(this, l[s + a], t, a), d === C && (d = this._$AH[a]), n || (n = !O(d) || d !== this._$AH[a]), d === u ? e = u : e !== u && (e += (d ?? "") + i[a + 1]), this._$AH[a] = d;
+      for (e = i[0], a = 0; a < i.length - 1; a++) d = P(this, l[s + a], t, a), d === C && (d = this._$AH[a]), n || (n = !R(d) || d !== this._$AH[a]), d === u ? e = u : e !== u && (e += (d ?? "") + i[a + 1]), this._$AH[a] = d;
     }
     n && !o && this.j(e);
   }
@@ -475,7 +475,7 @@ class ke extends D {
     this.element.toggleAttribute(this.name, !!e && e !== u);
   }
 }
-class Oe extends D {
+class Re extends D {
   constructor(e, t, s, o, i) {
     super(e, t, s, o, i), this.type = 5;
   }
@@ -489,7 +489,7 @@ class Oe extends D {
     typeof this._$AH == "function" ? this._$AH.call(((t = this.options) == null ? void 0 : t.host) ?? this.element, e) : this._$AH.handleEvent(e);
   }
 }
-class Re {
+class Oe {
   constructor(e, t, s) {
     this.element = e, this.type = 6, this._$AN = void 0, this._$AM = t, this.options = s;
   }
@@ -501,7 +501,7 @@ class Re {
   }
 }
 const j = T.litHtmlPolyfillSupport;
-j == null || j(R, H), (T.litHtmlVersions ?? (T.litHtmlVersions = [])).push("3.2.1");
+j == null || j(O, H), (T.litHtmlVersions ?? (T.litHtmlVersions = [])).push("3.2.1");
 const Ne = (r, e, t) => {
   const s = (t == null ? void 0 : t.renderBefore) ?? e;
   let o = s._$litPart$;
@@ -934,7 +934,7 @@ class Be extends v {
   }
   handleSubmitLogin(e) {
     e.preventDefault();
-    const t = e.explicitOriginalTarget.parentElement, s = new FormData(t).entries().reduce((o, [i, n]) => (o[i] = n, o), {});
+    const t = e.currentTarget, s = new FormData(t).entries().reduce((o, [i, n]) => (o[i] = n, o), {});
     this.isBusy = !0, this.errors = [], this.requestUpdate(), this.login(s).then(({ token: o, challenge: i }) => {
       if ((i == null ? void 0 : i.name) === "NEW_PASSWORD_REQUIRED") {
         this.token = o, this.username = s.username, this.password = s.password, this.setState(this.constructor.states.CHALLENGE_CHANGE_PW);
@@ -947,7 +947,7 @@ class Be extends v {
   }
   onSubmitChangePasswordChallenge(e) {
     e.preventDefault();
-    const t = e.explicitOriginalTarget.parentElement, s = new FormData(t).entries().reduce((l, [a, d]) => (l[a] = d, l), {}), o = s.password, i = s["confirm-password"];
+    const t = e.currentTarget, s = new FormData(t).entries().reduce((l, [a, d]) => (l[a] = d, l), {}), o = s.password, i = s["confirm-password"];
     if (o !== i) {
       this.errors = ["Passwords do not match"], this.requestUpdate();
       return;
@@ -983,7 +983,7 @@ class Be extends v {
   }
   renderLoginForm() {
     return p`
-			<form>
+			<form @submit=${this.handleSubmitLogin}>
 				<label for="username">User</label>
 				<input
 					type="text"
@@ -1007,7 +1007,7 @@ class Be extends v {
 				</div>
 				${this.errors ? this.errors.map((e) => p`<p class="error">${e}</p>`) : ""}
 
-				<input type="submit" value="Log in" @click=${this.handleSubmitLogin}
+				<input type="submit" value="Log in"
 					?disabled=${this.isBusy}
 				/>
 			</form>

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wral/studio.mods.auth",
-	"version": "2.0.0",
+	"version": "2.0.1",
 	"description": "Auth mod for Studio/Vellum",
 	"main": "dist/auth.cjs.js",
 	"module": "dist/auth.es.js",

package/src/login-form.mjs

@@ -117,7 +117,7 @@ class AuthLoginForm extends LitElement {
 
 	handleSubmitLogin(event) {
 		event.preventDefault();
-		const formElem = event.explicitOriginalTarget.parentElement;
+		const formElem = event.currentTarget;
 		const formData = new FormData(formElem).entries().reduce((acc, [key, value]) => {
 			acc[key] = value;
 			return acc;
@@ -150,7 +150,7 @@ class AuthLoginForm extends LitElement {
 
 	onSubmitChangePasswordChallenge(e) {
 		e.preventDefault();
-		const formElem = e.explicitOriginalTarget.parentElement;
+		const formElem = e.currentTarget;
 		const formData = new FormData(formElem).entries().reduce((acc, [key, value]) => {
 			acc[key] = value;
 			return acc;
@@ -209,7 +209,7 @@ class AuthLoginForm extends LitElement {
 
 	renderLoginForm() {
 		return html`
-			<form>
+			<form @submit=${this.handleSubmitLogin}>
 				<label for="username">User</label>
 				<input
 					type="text"
@@ -234,7 +234,7 @@ class AuthLoginForm extends LitElement {
 				${this.errors
 		? this.errors.map(error => html`<p class="error">${error}</p>`) : ''}
 
-				<input type="submit" value="Log in" @click=${this.handleSubmitLogin}
+				<input type="submit" value="Log in"
 					?disabled=${this.isBusy}
 				/>
 			</form>