Manually merge from 'pre-kjol' into 'master'

go/jsruntime/uikit/Validation.ts

@@ -1,4 +1,4 @@
-import { Accessor, createMemo } from "solid-js";
+import {Accessor, createMemo} from "solid-js";
 
 export interface Validation<T> {
     id: string; // snake case identifier that is "touched"
@@ -11,8 +11,14 @@ export interface Validation<T> {
     invalidMsg?: string;
 }
 
+export interface ErorrField {
+    error: Accessor<string>;
+    id: string;
+    touchKey?: string; // specify if different from id
+}
+
 export function createValidation(validation: Validation<string>): Accessor<string> {
-    const { id, name, required, touched, isValidFunc, invalidMsg } = validation;
+    const {id, name, required, touched, isValidFunc, invalidMsg} = validation;
     const field = () => validation.field().trim();
     // When no blur accessor is provided, fall back to the live value so the
     // "has value but not blurred yet" guard is always false and validation
@@ -29,15 +35,22 @@ export function createValidation(validation: Validation<string>): Accessor<strin
 
 export function isPhoneNumberValid(phoneNumber: string): boolean {
     phoneNumber = phoneNumber.replace(/\D/g, "");
-    return phoneNumber.length == 10
+
+    if (phoneNumber.length != 10) {
+        return false;
+    }
+
+    const areaCode = Number(phoneNumber.substring(0, 3));
+    return areaCode >= 200;
 }
 
 export function isEmailValid(email: string): boolean {
-    const regex = /^[-!#$%&'*+\/0-9=?A-Z^_a-z`{|}~](\.?[-!#$%&'*+\/0-9=?A-Z^_a-z`{|}~])*@[a-zA-Z0-9](-*\.?[a-zA-Z0-9])*\.[a-zA-Z](-?[a-zA-Z0-9])+$/;
+    const regex =
+        /^[-!#$%&'*+\/0-9=?A-Z^_a-z`{|}~](\.?[-!#$%&'*+\/0-9=?A-Z^_a-z`{|}~])*@[a-zA-Z0-9](-*\.?[a-zA-Z0-9])*\.[a-zA-Z](-?[a-zA-Z0-9])+$/;
 
     if (!email) return false;
 
-    let emailParts = email.split('@');
+    let emailParts = email.split("@");
 
     if (emailParts.length !== 2) return false;
 
@@ -45,27 +58,29 @@ export function isEmailValid(email: string): boolean {
     let address = emailParts[1];
 
     if (account.length > 64) return false;
-
     else if (address.length > 255) return false;
 
-    let domainParts = address.split('.');
+    let domainParts = address.split(".");
 
-    if (domainParts.some(function (part) {
-        return part.length > 63;
-    })) return false;
+    if (
+        domainParts.some(function (part) {
+            return part.length > 63;
+        })
+    )
+        return false;
 
     return regex.test(email);
 }
 
 export function isUrlValid(url: string): boolean {
-    const regex = /[(http(s)?):\/\/(www\.)?a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/;
+    const regex = /^(https?:\/\/)?(www\.)?[a-zA-Z0-9@:%._\+~#-]{1,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&\/=]*)$/;
 
     return regex.test(url);
 }
 
 export function isZipCodeValid(zip: string): boolean {
     const rawZip = String(zip).replace(/\D/g, "");
-    return rawZip.length == 5 || rawZip.length == 9
+    return rawZip.length == 5 || rawZip.length == 9;
 }
 
 export function isTaxIdValid(id: string): boolean {
@@ -75,13 +90,13 @@ export function isTaxIdValid(id: string): boolean {
 
 // isAtLeastMinChars checks if the input string is at least "min" characters long
 // and returns a boolean, true if valid, false if not.
-export function isAtLeastMinChars(input: string, min:number):boolean {
+export function isAtLeastMinChars(input: string, min: number): boolean {
     return input.length >= min;
 }
 
 // isWithinMaxChars checks if the input string is at most "max" characters long
 // and returns a boolean, true if valid, false if not.
-export function isWithinMaxChars(input: string, max:number):boolean {
+export function isWithinMaxChars(input: string, max: number): boolean {
     return input.length <= max;
 }
 
@@ -89,17 +104,17 @@ export function isWithinMaxChars(input: string, max:number):boolean {
 // and returns a boolean, true if valid, false if not.
 export function isNameValid(name: string): boolean {
     const regex = /^[\p{L}]*[\p{L} '\-]*[\p{L}]$/u;
-    
+
     return regex.test(name);
 }
 
 // isUsernameValid checks if the username contains 5-50 characters and only consists of alphanumeric
 // characters. Returns an error message if invalid, empty string if valid.
 export function isUsernameValid(username: string): string {
-    if (username.length < 5 || username.length > 50) return "Username must have 5-50 characters"
-    
+    if (username.length < 5 || username.length > 50) return "Username must have 5-50 characters";
+
     const regex = /^[A-Za-z0-9]*$/;
-    if (!regex.test(username)) return "Username must only contain alphanumeric characters"
+    if (!regex.test(username)) return "Username must only contain alphanumeric characters";
 
     return ""; // Valid
 }