From f0068afc8f7af1a912634476d21e224770c7d12e Mon Sep 17 00:00:00 2001 From: monikatravelopia Date: Mon, 14 Jul 2025 16:05:22 +0530 Subject: [PATCH 1/4] Add validation for Zip code --- src/form/index.ts | 2 ++ src/form/validators/zip.ts | 31 +++++++++++++++++++++++++++++++ 2 files changed, 33 insertions(+) create mode 100644 src/form/validators/zip.ts diff --git a/src/form/index.ts b/src/form/index.ts index eb0c142..63f2960 100644 --- a/src/form/index.ts +++ b/src/form/index.ts @@ -14,6 +14,7 @@ import * as email from './validators/email'; import * as minLength from './validators/min-length'; import * as maxLength from './validators/max-length'; import * as noEmptySpaces from './validators/no-empty-spaces'; +import * as zip from './validators/zip'; // Prepare validators. const validators = [ @@ -22,6 +23,7 @@ const validators = [ minLength, maxLength, noEmptySpaces, + zip, ]; /** diff --git a/src/form/validators/zip.ts b/src/form/validators/zip.ts new file mode 100644 index 0000000..efddab1 --- /dev/null +++ b/src/form/validators/zip.ts @@ -0,0 +1,31 @@ +/** + * Internal dependencies. + */ +import { TPFormFieldElement } from '../tp-form-field'; +import { TPFormValidator } from '../definitions'; +import { getErrorMessage } from '../utility'; + +/** + * Name. + */ +export const name: string = 'zip'; + +/** + * Error message. + */ +export const errorMessage: string = 'Please enter a valid zip code'; + +/** + * Validator. + */ +export const validator: TPFormValidator = { + validate: ( field: TPFormFieldElement ): boolean => { + const value = field.getField()?.value ?? ''; + + // International zip code pattern: letters, numbers, spaces, hyphens, 3-10 chars + const zipCodeRegex = /^[A-Za-z0-9][A-Za-z0-9\- ]{1,8}[A-Za-z0-9]$/; + + return zipCodeRegex.test( value.trim() ); + }, + getErrorMessage: (): string => getErrorMessage( name ), +}; \ No newline at end of file From a01a3e0969f636c997083b84475834741d05b6c9 Mon Sep 17 00:00:00 2001 From: monikatravelopia Date: Mon, 14 Jul 2025 16:15:43 +0530 Subject: [PATCH 2/4] Fix lint issue --- package-lock.json | 6 +++--- src/form/validators/zip.ts | 10 ++++++---- 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7ea5880..71038ce 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3591,9 +3591,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001702", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001702.tgz", - "integrity": "sha512-LoPe/D7zioC0REI5W73PeR1e1MLCipRGq/VkovJnd6Df+QVqT+vT33OXCp8QUd7kA7RZrHWxb1B36OQKI/0gOA==", + "version": "1.0.30001727", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001727.tgz", + "integrity": "sha512-pB68nIHmbN6L/4C6MH1DokyR3bYqFwjaSs/sWDHGj4CTcFtQUQMuJftVwWkXq7mNWOybD3KhUv3oWHoGxgP14Q==", "dev": true, "funding": [ { diff --git a/src/form/validators/zip.ts b/src/form/validators/zip.ts index efddab1..960121f 100644 --- a/src/form/validators/zip.ts +++ b/src/form/validators/zip.ts @@ -20,12 +20,14 @@ export const errorMessage: string = 'Please enter a valid zip code'; */ export const validator: TPFormValidator = { validate: ( field: TPFormFieldElement ): boolean => { + // Get the field value or default to empty string. const value = field.getField()?.value ?? ''; - - // International zip code pattern: letters, numbers, spaces, hyphens, 3-10 chars + + // International zip code pattern: letters, numbers, spaces, hyphens, 3-10 chars. const zipCodeRegex = /^[A-Za-z0-9][A-Za-z0-9\- ]{1,8}[A-Za-z0-9]$/; - + + // Test the trimmed value against the regex pattern. return zipCodeRegex.test( value.trim() ); }, getErrorMessage: (): string => getErrorMessage( name ), -}; \ No newline at end of file +}; From 500ea2a0d50c01484209b5d83b665d08def65a1d Mon Sep 17 00:00:00 2001 From: monikatravelopia Date: Tue, 15 Jul 2025 14:22:12 +0530 Subject: [PATCH 3/4] Add custom regex pattern from zip-pattern attribute --- src/form/validators/zip.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/form/validators/zip.ts b/src/form/validators/zip.ts index 960121f..312ec0c 100644 --- a/src/form/validators/zip.ts +++ b/src/form/validators/zip.ts @@ -23,8 +23,13 @@ export const validator: TPFormValidator = { // Get the field value or default to empty string. const value = field.getField()?.value ?? ''; - // International zip code pattern: letters, numbers, spaces, hyphens, 3-10 chars. - const zipCodeRegex = /^[A-Za-z0-9][A-Za-z0-9\- ]{1,8}[A-Za-z0-9]$/; + // Get custom regex pattern from zip-pattern attribute or use default. + const customPattern: string | null = field.getAttribute( 'zip-pattern' ); + const defaultPattern: string = '^[A-Za-z0-9][A-Za-z0-9\\- ]{1,8}[A-Za-z0-9]$'; + const pattern: string = customPattern ?? defaultPattern; + + // Create regex object from pattern. + const zipCodeRegex: RegExp = new RegExp( pattern ); // Test the trimmed value against the regex pattern. return zipCodeRegex.test( value.trim() ); From f9bf57e79ec217765d61dcc46f9ff68bbf25972d Mon Sep 17 00:00:00 2001 From: monikatravelopia Date: Wed, 16 Jul 2025 11:11:40 +0530 Subject: [PATCH 4/4] Update zip-pattern attribute name to regex --- src/form/validators/zip.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/form/validators/zip.ts b/src/form/validators/zip.ts index 312ec0c..1c2a543 100644 --- a/src/form/validators/zip.ts +++ b/src/form/validators/zip.ts @@ -23,8 +23,8 @@ export const validator: TPFormValidator = { // Get the field value or default to empty string. const value = field.getField()?.value ?? ''; - // Get custom regex pattern from zip-pattern attribute or use default. - const customPattern: string | null = field.getAttribute( 'zip-pattern' ); + // Get custom regex pattern from regex attribute or use default. + const customPattern: string | null = field.getAttribute( 'regex' ); const defaultPattern: string = '^[A-Za-z0-9][A-Za-z0-9\\- ]{1,8}[A-Za-z0-9]$'; const pattern: string = customPattern ?? defaultPattern;