@schukai/monster 4.45.5 → 4.46.0

package/source/components/form/login.mjs

@@ -538,7 +538,7 @@ function getTranslations() {
 				messageSomethingWentWrong: "出了点问题，请稍后再试。",
 				messageThisFormIsNotConfigured: "此表单尚未配置。",
 				messagePasswordResetDisabled:
-					"此功能无法使用，因为您的帐户启用了双因素身份验证。请联系管理员。",
+					"此功能无法使用，因为您的帐户启用了二因素身份验证。请联系管理员。",
 			};
 
 		case "hi":
@@ -1039,6 +1039,63 @@ function getTranslations() {
 	}
 }
 
+/**
+ * Normalize the result of a callback into a unified structure.
+ *
+ * Supported return types:
+ *  - undefined  → no change
+ *  - string     → transformed value
+ *  - false      → valid=false
+ *  - { value?, valid?, message?, stop? } → structured result
+ *
+ * @private
+ * @param {*} callbackResult
+ * @param {string} currentValue
+ * @return {{ value: string, valid: (boolean|undefined), message: (string|undefined), stop: boolean, raw: * }}
+ */
+function normalizeCallbackResult(callbackResult, currentValue) {
+	const normalized = {
+		value: currentValue,
+		valid: undefined,
+		message: undefined,
+		stop: false,
+		raw: callbackResult,
+	};
+
+	if (callbackResult === undefined) {
+		return normalized;
+	}
+
+	if (typeof callbackResult === "string") {
+		normalized.value = callbackResult;
+		return normalized;
+	}
+
+	if (callbackResult === false) {
+		normalized.valid = false;
+		return normalized;
+	}
+
+	if (callbackResult && typeof callbackResult === "object") {
+		if (Object.prototype.hasOwnProperty.call(callbackResult, "value")) {
+			normalized.value = callbackResult.value;
+		}
+		if (Object.prototype.hasOwnProperty.call(callbackResult, "valid")) {
+			normalized.valid = callbackResult.valid;
+		}
+		if (Object.prototype.hasOwnProperty.call(callbackResult, "message")) {
+			normalized.message = callbackResult.message;
+		}
+		if (Object.prototype.hasOwnProperty.call(callbackResult, "stop")) {
+			normalized.stop = Boolean(callbackResult.stop);
+		}
+
+		return normalized;
+	}
+
+	return normalized;
+}
+
 /**
  * @private
  * @return {initEventHandler}
@@ -1129,11 +1186,30 @@ function initEventHandler() {
 			"input[name='username']",
 		).value;
 
+		// New structured callback handling for username (backwards compatible)
 		const userCallback = this.getOption("callbacks.username");
 		if (isFunction(userCallback)) {
-			const userCallbackResult = userCallback.call(this, username);
-			if (userCallbackResult !== undefined) {
-				username = userCallbackResult;
+			const result = normalizeCallbackResult(
+				userCallback.call(this, username),
+				username,
+			);
+			username = result.value;
+
+			// If callback explicitly marks invalid or wants to stop, handle immediately
+			if (result.valid === false || result.stop === true) {
+				const timeout = this.getOption("timeoutForMessage");
+				const msg =
+					result.message || this.getOption("labels.messageEmptyUserName");
+
+				this.setOption("classes.usernameInvalid", "invalid");
+				this[loginButtonSymbol].setMessage(msg);
+				this[loginButtonSymbol].showMessage(timeout);
+				this[loginButtonSymbol].setState("failed", timeout);
+
+				setTimeout(() => {
+					this.shadowRoot.querySelector("input[name='username']").focus();
+				}, 0);
+				return;
 			}
 		}
 
@@ -1281,16 +1357,39 @@ function initEventHandler() {
 	this[requestLinkButtonSymbol].setOption("actions.click", (event) => {
 		const emailElement = this.shadowRoot.querySelector("input[name='email']");
 
-		// get username and password
+		// get email value and HTML validity
 		let mail = emailElement.value;
 		let valid = emailElement.checkValidity();
 
+		const timeout = this.getOption("timeoutForMessage");
+
+		// New structured callback handling for forgotPassword (backwards compatible)
 		const mailCallback = this.getOption("callbacks.forgotPassword");
 		if (isFunction(mailCallback)) {
-			const mailCallbackResult = mailCallback.call(this, mail);
-			if (mailCallbackResult !== undefined) {
-				mail = mailCallbackResult;
-				valid = true;
+			const result = normalizeCallbackResult(
+				mailCallback.call(this, mail),
+				mail,
+			);
+
+			mail = result.value;
+
+			if (result.valid !== undefined) {
+				valid = result.valid;
+			}
+
+			if (result.valid === false || result.stop === true) {
+				this.setOption("classes.emailInvalid", "invalid");
+
+				const msg =
+					result.message ||
+					(mail === "" || mail === null
+						? this.getOption("labels.messageEmptyEmail")
+						: this.getOption("labels.messageInvalidEmail"));
+
+				this[requestLinkButtonSymbol].setMessage(msg);
+				this[requestLinkButtonSymbol].showMessage(timeout);
+				this[requestLinkButtonSymbol].setState("failed", timeout);
+				return;
 			}
 		}
 
@@ -1305,8 +1404,6 @@ function initEventHandler() {
 			this.setOption("classes.emailInvalid", "");
 		}
 
-		const timeout = this.getOption("timeoutForMessage");
-
 		if (msg !== null && msg !== undefined) {
 			this[requestLinkButtonSymbol].setMessage(msg);
 			this[requestLinkButtonSymbol].showMessage(timeout);
@@ -1337,11 +1434,11 @@ function initEventHandler() {
 			.fetch(url, options)
 			.then((response) => {
 				if (response.ok) {
-					const timeout = this.getOption("timeoutForSuccess");
-					this[requestLinkButtonSymbol].setState("successful", timeout);
+					const timeoutSuccess = this.getOption("timeoutForSuccess");
+					this[requestLinkButtonSymbol].setState("successful", timeoutSuccess);
 					setTimeout(() => {
 						this.openDigits();
-					}, timeout);
+					}, timeoutSuccess);
 				} else {
 					if (response.status === 403) {
 						this[requestLinkButtonSymbol].setMessage(
@@ -1423,12 +1520,12 @@ function initEventHandler() {
 			.fetch(url, options)
 			.then((response) => {
 				if (response.ok) {
-					const timeout = this.getOption("timeoutForSuccess");
-					this[secondFactorButtonSymbol].setState("successful", timeout);
+					const timeoutSuccess = this.getOption("timeoutForSuccess");
+					this[secondFactorButtonSymbol].setState("successful", timeoutSuccess);
 					fireEvent(this, "second-factor-success");
 					setTimeout(() => {
 						this.openLoggedIn();
-					}, timeout);
+					}, timeoutSuccess);
 				} else {
 					if (response.status === 403) {
 						this[secondFactorButtonSymbol].setMessage(
@@ -1505,14 +1602,14 @@ function initEventHandler() {
 		getWindow()
 			.fetch(url, options)
 			.then((response) => {
-				const timeout = this.getOption("timeoutForSuccess");
+				const timeoutSuccess = this.getOption("timeoutForSuccess");
 
 				if (response.ok) {
-					this[digitsButtonSymbol].setState("successful", timeout);
+					this[digitsButtonSymbol].setState("successful", timeoutSuccess);
 					fireEvent(this, "digits-success");
 					setTimeout(() => {
 						this.openLoggedIn();
-					}, timeout);
+					}, timeoutSuccess);
 				} else {
 					if (response.status === 403) {
 						this[digitsButtonSymbol].setMessage(