pixel-react-excel-sheet 1.0.32 → 1.0.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/Accordion/Accordion.d.ts +1 -1
- package/lib/components/Accordion/types.d.ts +4 -0
- package/lib/components/AllProjectsDropdown/types.d.ts +2 -0
- package/lib/components/Button/Button.d.ts +2 -2
- package/lib/components/Button/types.d.ts +17 -0
- package/lib/components/Charts/DashboardDonutChart/types.d.ts +1 -0
- package/lib/components/Charts/MultiRadialChart/types.d.ts +3 -0
- package/lib/components/ChooseFile/ChooseFile.d.ts +3 -0
- package/lib/components/ChooseFile/types.d.ts +68 -0
- package/lib/components/ConditionalDropdown/ConditionalDropdown.d.ts +1 -2
- package/lib/components/ConditionalDropdown/types.d.ts +3 -3
- package/lib/components/LabelEditTextField/types.d.ts +3 -1
- package/lib/components/ScriptSwitchButton/ScriptSwitchButton.d.ts +9 -0
- package/lib/components/ScriptSwitchButton/index.d.ts +1 -0
- package/lib/components/StatusCard/types.d.ts +2 -0
- package/lib/components/TableTree/Components/TableCell.d.ts +1 -1
- package/lib/components/TableTree/Components/TableRow.d.ts +1 -1
- package/lib/components/TableTree/data.d.ts +115 -1
- package/lib/components/TableTree/types.d.ts +4 -0
- package/lib/index.d.ts +218 -65
- package/lib/index.esm.js +721 -419
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +767 -418
- package/lib/index.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/validations/regex.d.ts +46 -0
- package/package.json +1 -1
- package/src/StyleGuide/ColorPalette/colorPaletteList.ts +5 -0
- package/src/assets/Themes/BaseTheme.scss +1 -1
- package/src/assets/Themes/BlueTheme.scss +1 -1
- package/src/assets/Themes/DarkTheme.scss +1 -1
- package/src/assets/icons/failed_status_icon.svg +1 -1
- package/src/assets/icons/flaky_status_icon.svg +1 -1
- package/src/assets/icons/settings.svg +3 -0
- package/src/assets/icons/skipped_status_icon.svg +1 -1
- package/src/assets/icons/warning_status_icon.svg +1 -1
- package/src/components/Accordion/Accordion.stories.tsx +13 -0
- package/src/components/Accordion/Accordion.tsx +2 -1
- package/src/components/Accordion/types.ts +4 -0
- package/src/components/AllProjectsDropdown/types.ts +2 -0
- package/src/components/AppHeader/AppHeader.scss +6 -2
- package/src/components/Button/Button.scss +12 -0
- package/src/components/Button/Button.tsx +29 -11
- package/src/components/Button/types.ts +21 -0
- package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.scss +83 -30
- package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.tsx +2 -0
- package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.tsx +38 -17
- package/src/components/Charts/DashboardDonutChart/types.ts +1 -0
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.scss +0 -1
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.stories.tsx +2 -1
- package/src/components/Charts/MultiRadialChart/MultiRadialChart.tsx +18 -4
- package/src/components/Charts/MultiRadialChart/types.ts +4 -1
- package/src/components/ChooseFile/ChooseFile.stories.tsx +190 -0
- package/src/components/ChooseFile/ChooseFile.tsx +46 -0
- package/src/components/ChooseFile/types.ts +78 -0
- package/src/components/ConditionalDropdown/ConditionalDropdown.stories.tsx +8 -5
- package/src/components/ConditionalDropdown/ConditionalDropdown.tsx +133 -135
- package/src/components/ConditionalDropdown/types.ts +8 -8
- package/src/components/ConnectingBranch/ConnectingBranch.scss +171 -169
- package/src/components/ConnectingBranch/ConnectingBranch.tsx +108 -107
- package/src/components/DatePicker/DatePicker.scss +310 -0
- package/src/components/Excel/ExcelFile/ExcelFile.tsx +4 -4
- package/src/components/Excel/ExcelFile/ExcelFileComponents/ActiveCell.tsx +22 -12
- package/src/components/Excel/ExcelFile/ExcelFileComponents/ColumnIndicator.tsx +2 -2
- package/src/components/Excel/ExcelFile/ExcelFileComponents/DataEditor.tsx +4 -1
- package/src/components/Excel/ExcelFile/ExcelFileComponents/RowIndicator.tsx +2 -2
- package/src/components/Excel/ExcelFile/ExcelFileComponents/reducerFunctions.ts +77 -10
- package/src/components/Icon/iconList.ts +2 -0
- package/src/components/LabelEditTextField/LabelEditTextField.scss +4 -0
- package/src/components/LabelEditTextField/LabelEditTextField.stories.tsx +8 -3
- package/src/components/LabelEditTextField/LabelEditTextField.tsx +42 -18
- package/src/components/LabelEditTextField/types.ts +3 -1
- package/src/components/MachineInputField/MachineInputField.tsx +2 -2
- package/src/components/NLPInput/components/NlpDropDown/NlpDropdown.scss +1 -1
- package/src/components/ScriptSwitchButton/ScriptSwitchButton.scss +33 -0
- package/src/components/ScriptSwitchButton/ScriptSwitchButton.stories.tsx +48 -0
- package/src/components/ScriptSwitchButton/ScriptSwitchButton.tsx +65 -0
- package/src/components/ScriptSwitchButton/index.ts +1 -0
- package/src/components/Select/Select.tsx +4 -4
- package/src/components/StatusCard/StatusCard.scss +2 -1
- package/src/components/StatusCard/StatusCard.stories.tsx +59 -1
- package/src/components/StatusCard/StatusCard.tsx +10 -2
- package/src/components/StatusCard/types.ts +2 -0
- package/src/components/TableTree/Components/TableBody.tsx +20 -16
- package/src/components/TableTree/Components/TableCell.tsx +47 -31
- package/src/components/TableTree/Components/TableRow.tsx +4 -0
- package/src/components/TableTree/TableTree.scss +121 -109
- package/src/components/TableTree/data.ts +48 -2
- package/src/components/TableTree/types.ts +4 -0
- package/src/index.ts +97 -0
- package/src/validations/regex.stories.tsx +362 -0
- package/src/validations/regex.ts +194 -0
|
@@ -0,0 +1,362 @@
|
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
|
+
|
|
3
|
+
import {
|
|
4
|
+
EMAIL_REGEX,
|
|
5
|
+
URL_REGEX,
|
|
6
|
+
PHONE_REGEX,
|
|
7
|
+
POSTAL_CODE_REGEX,
|
|
8
|
+
IPV4_REGEX,
|
|
9
|
+
IPV6_REGEX,
|
|
10
|
+
HEX_COLOR_REGEX,
|
|
11
|
+
PASSWORD_SIMPLE_REGEX,
|
|
12
|
+
PASSWORD_COMPLEX_REGEX,
|
|
13
|
+
ALPHABET_ONLY_REGEX,
|
|
14
|
+
NUMBERS_ONLY_REGEX,
|
|
15
|
+
ALPHANUMERIC_REGEX,
|
|
16
|
+
DATE_REGEX,
|
|
17
|
+
TIME_REGEX,
|
|
18
|
+
FILE_EXTENSION_REGEX,
|
|
19
|
+
MAC_ADDRESS_REGEX,
|
|
20
|
+
CREDIT_CARD_REGEX,
|
|
21
|
+
SSN_REGEX,
|
|
22
|
+
UUID_REGEX,
|
|
23
|
+
HTML_TAG_REGEX,
|
|
24
|
+
WHITESPACE_REGEX,
|
|
25
|
+
US_ZIP_CODE_REGEX,
|
|
26
|
+
USERNAME_REGEX,
|
|
27
|
+
INDIAN_PHONE_REGEX,
|
|
28
|
+
INDIAN_PIN_CODE_REGEX,
|
|
29
|
+
GSTIN_REGEX,
|
|
30
|
+
PAN_CARD_REGEX,
|
|
31
|
+
AADHAAR_REGEX,
|
|
32
|
+
VEHICLE_REGISTRATION_REGEX,
|
|
33
|
+
INDIAN_CURRENCY_REGEX,
|
|
34
|
+
INTERNATIONAL_PHONE_REGEX,
|
|
35
|
+
INDIAN_PASSPORT_REGEX,
|
|
36
|
+
DRIVING_LICENSE_REGEX,
|
|
37
|
+
USERNAME_SPECIAL_REGEX,
|
|
38
|
+
DECIMAL_NUMBER_REGEX,
|
|
39
|
+
HTML_ATTRIBUTE_REGEX,
|
|
40
|
+
RGB_COLOR_REGEX,
|
|
41
|
+
HSL_COLOR_REGEX,
|
|
42
|
+
BASE64_REGEX,
|
|
43
|
+
BINARY_NUMBER_REGEX,
|
|
44
|
+
HEXADECIMAL_NUMBER_REGEX,
|
|
45
|
+
ROMAN_NUMERALS_REGEX,
|
|
46
|
+
CURRENCY_GENERIC_REGEX,
|
|
47
|
+
LINKEDIN_PROFILE_REGEX,
|
|
48
|
+
TWITTER_HANDLE_REGEX,
|
|
49
|
+
} from './regex';
|
|
50
|
+
|
|
51
|
+
export default {
|
|
52
|
+
title: 'Regex/Validations',
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
export const Playground = () => {
|
|
56
|
+
const [input, setInput] = useState('');
|
|
57
|
+
const [result, setResult] = useState('');
|
|
58
|
+
const [selectedRegex, setSelectedRegex] = useState('');
|
|
59
|
+
|
|
60
|
+
const validators = [
|
|
61
|
+
{
|
|
62
|
+
name: 'EMAIL_REGEX',
|
|
63
|
+
regex: EMAIL_REGEX,
|
|
64
|
+
description: 'Validates an email address (e.g. user@example.com)',
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
name: 'URL_REGEX',
|
|
68
|
+
regex: URL_REGEX,
|
|
69
|
+
description: 'Validates a URL (e.g. https://www.example.com)',
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
name: 'PHONE_REGEX',
|
|
73
|
+
regex: PHONE_REGEX,
|
|
74
|
+
description: 'Validates a general phone number (e.g. (123) 456-7890)',
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
name: 'POSTAL_CODE_REGEX',
|
|
78
|
+
regex: POSTAL_CODE_REGEX,
|
|
79
|
+
description: 'Validates postal code format',
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
name: 'IPV4_REGEX',
|
|
83
|
+
regex: IPV4_REGEX,
|
|
84
|
+
description: 'Validates IPv4 addresses (e.g. 192.168.0.1)',
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
name: 'IPV6_REGEX',
|
|
88
|
+
regex: IPV6_REGEX,
|
|
89
|
+
description:
|
|
90
|
+
'Validates IPv6 addresses (e.g. 2001:0db8:85a3:0000:0000:8a2e:0370:7334)',
|
|
91
|
+
},
|
|
92
|
+
{
|
|
93
|
+
name: 'HEX_COLOR_REGEX',
|
|
94
|
+
regex: HEX_COLOR_REGEX,
|
|
95
|
+
description: 'Validates hex color codes (e.g. #FFFFFF)',
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
name: 'PASSWORD_SIMPLE_REGEX',
|
|
99
|
+
regex: PASSWORD_SIMPLE_REGEX,
|
|
100
|
+
description: 'Validates a simple password (e.g. password123)',
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
name: 'PASSWORD_COMPLEX_REGEX',
|
|
104
|
+
regex: PASSWORD_COMPLEX_REGEX,
|
|
105
|
+
description: 'Validates a complex password (e.g. P@ssw0rd!',
|
|
106
|
+
},
|
|
107
|
+
{
|
|
108
|
+
name: 'ALPHABET_ONLY_REGEX',
|
|
109
|
+
regex: ALPHABET_ONLY_REGEX,
|
|
110
|
+
description: 'Validates alphabets only (e.g. abc)',
|
|
111
|
+
},
|
|
112
|
+
{
|
|
113
|
+
name: 'NUMBERS_ONLY_REGEX',
|
|
114
|
+
regex: NUMBERS_ONLY_REGEX,
|
|
115
|
+
description: 'Validates numbers only (e.g. 123)',
|
|
116
|
+
},
|
|
117
|
+
{
|
|
118
|
+
name: 'ALPHANUMERIC_REGEX',
|
|
119
|
+
regex: ALPHANUMERIC_REGEX,
|
|
120
|
+
description: 'Validates alphanumeric values (e.g. abc123)',
|
|
121
|
+
},
|
|
122
|
+
{
|
|
123
|
+
name: 'DATE_REGEX',
|
|
124
|
+
regex: DATE_REGEX,
|
|
125
|
+
description: 'Validates date in YYYY-MM-DD format (e.g. 2024-12-11)',
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
name: 'TIME_REGEX',
|
|
129
|
+
regex: TIME_REGEX,
|
|
130
|
+
description: 'Validates time in HH:MM:SS format (e.g. 14:30:45)',
|
|
131
|
+
},
|
|
132
|
+
{
|
|
133
|
+
name: 'FILE_EXTENSION_REGEX',
|
|
134
|
+
regex: FILE_EXTENSION_REGEX,
|
|
135
|
+
description: 'Validates file extensions (e.g. .jpg, .png)',
|
|
136
|
+
},
|
|
137
|
+
{
|
|
138
|
+
name: 'MAC_ADDRESS_REGEX',
|
|
139
|
+
regex: MAC_ADDRESS_REGEX,
|
|
140
|
+
description: 'Validates MAC address (e.g. 00:14:22:01:23:45)',
|
|
141
|
+
},
|
|
142
|
+
{
|
|
143
|
+
name: 'CREDIT_CARD_REGEX',
|
|
144
|
+
regex: CREDIT_CARD_REGEX,
|
|
145
|
+
description: 'Validates credit card number (e.g. 1234 5678 9012 3456)',
|
|
146
|
+
},
|
|
147
|
+
{
|
|
148
|
+
name: 'SSN_REGEX',
|
|
149
|
+
regex: SSN_REGEX,
|
|
150
|
+
description: 'Validates Social Security Number (e.g. 123-45-6789)',
|
|
151
|
+
},
|
|
152
|
+
{
|
|
153
|
+
name: 'UUID_REGEX',
|
|
154
|
+
regex: UUID_REGEX,
|
|
155
|
+
description: 'Validates UUID (e.g. 123e4567-e89b-12d3-a456-426614174000)',
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
name: 'HTML_TAG_REGEX',
|
|
159
|
+
regex: HTML_TAG_REGEX,
|
|
160
|
+
description: 'Validates HTML tags (e.g. <div>, <span>)',
|
|
161
|
+
},
|
|
162
|
+
{
|
|
163
|
+
name: 'WHITESPACE_REGEX',
|
|
164
|
+
regex: WHITESPACE_REGEX,
|
|
165
|
+
description: 'Validates whitespace characters (e.g. spaces, tabs)',
|
|
166
|
+
},
|
|
167
|
+
{
|
|
168
|
+
name: 'US_ZIP_CODE_REGEX',
|
|
169
|
+
regex: US_ZIP_CODE_REGEX,
|
|
170
|
+
description: 'Validates US ZIP code (e.g. 90210)',
|
|
171
|
+
},
|
|
172
|
+
{
|
|
173
|
+
name: 'USERNAME_REGEX',
|
|
174
|
+
regex: USERNAME_REGEX,
|
|
175
|
+
description: 'Validates username (e.g. user123)',
|
|
176
|
+
},
|
|
177
|
+
{
|
|
178
|
+
name: 'INDIAN_PHONE_REGEX',
|
|
179
|
+
regex: INDIAN_PHONE_REGEX,
|
|
180
|
+
description: 'Validates Indian phone number (e.g. +91 9876543210)',
|
|
181
|
+
},
|
|
182
|
+
{
|
|
183
|
+
name: 'INDIAN_PIN_CODE_REGEX',
|
|
184
|
+
regex: INDIAN_PIN_CODE_REGEX,
|
|
185
|
+
description: 'Validates Indian PIN code (e.g. 110001)',
|
|
186
|
+
},
|
|
187
|
+
{
|
|
188
|
+
name: 'GSTIN_REGEX',
|
|
189
|
+
regex: GSTIN_REGEX,
|
|
190
|
+
description: 'Validates GSTIN number (e.g. 07AACCB1234K1Z5)',
|
|
191
|
+
},
|
|
192
|
+
{
|
|
193
|
+
name: 'PAN_CARD_REGEX',
|
|
194
|
+
regex: PAN_CARD_REGEX,
|
|
195
|
+
description: 'Validates PAN card number (e.g. ABCDE1234F)',
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
name: 'AADHAAR_REGEX',
|
|
199
|
+
regex: AADHAAR_REGEX,
|
|
200
|
+
description: 'Validates Aadhaar number (e.g. 1234 5678 9012)',
|
|
201
|
+
},
|
|
202
|
+
{
|
|
203
|
+
name: 'VEHICLE_REGISTRATION_REGEX',
|
|
204
|
+
regex: VEHICLE_REGISTRATION_REGEX,
|
|
205
|
+
description: 'Validates vehicle registration number (e.g. DL 12 AB 1234)',
|
|
206
|
+
},
|
|
207
|
+
{
|
|
208
|
+
name: 'INDIAN_CURRENCY_REGEX',
|
|
209
|
+
regex: INDIAN_CURRENCY_REGEX,
|
|
210
|
+
description: 'Validates Indian currency format (e.g. ₹1234.56)',
|
|
211
|
+
},
|
|
212
|
+
{
|
|
213
|
+
name: 'INTERNATIONAL_PHONE_REGEX',
|
|
214
|
+
regex: INTERNATIONAL_PHONE_REGEX,
|
|
215
|
+
description:
|
|
216
|
+
'Validates international phone numbers (e.g. +44 20 7946 0958)',
|
|
217
|
+
},
|
|
218
|
+
{
|
|
219
|
+
name: 'INDIAN_PASSPORT_REGEX',
|
|
220
|
+
regex: INDIAN_PASSPORT_REGEX,
|
|
221
|
+
description: 'Validates Indian passport number (e.g. A1234567)',
|
|
222
|
+
},
|
|
223
|
+
{
|
|
224
|
+
name: 'DRIVING_LICENSE_REGEX',
|
|
225
|
+
regex: DRIVING_LICENSE_REGEX,
|
|
226
|
+
description: 'Validates driving license number (e.g. DL-123456789012)',
|
|
227
|
+
},
|
|
228
|
+
{
|
|
229
|
+
name: 'USERNAME_SPECIAL_REGEX',
|
|
230
|
+
regex: USERNAME_SPECIAL_REGEX,
|
|
231
|
+
description:
|
|
232
|
+
'Validates username with special characters (e.g. user_123@)',
|
|
233
|
+
},
|
|
234
|
+
{
|
|
235
|
+
name: 'DECIMAL_NUMBER_REGEX',
|
|
236
|
+
regex: DECIMAL_NUMBER_REGEX,
|
|
237
|
+
description: 'Validates decimal numbers (e.g. 123.45)',
|
|
238
|
+
},
|
|
239
|
+
{
|
|
240
|
+
name: 'HTML_ATTRIBUTE_REGEX',
|
|
241
|
+
regex: HTML_ATTRIBUTE_REGEX,
|
|
242
|
+
description: 'Validates HTML attribute value (e.g. class="my-class")',
|
|
243
|
+
},
|
|
244
|
+
{
|
|
245
|
+
name: 'RGB_COLOR_REGEX',
|
|
246
|
+
regex: RGB_COLOR_REGEX,
|
|
247
|
+
description: 'Validates RGB color format (e.g. rgb(255, 0, 0))',
|
|
248
|
+
},
|
|
249
|
+
{
|
|
250
|
+
name: 'HSL_COLOR_REGEX',
|
|
251
|
+
regex: HSL_COLOR_REGEX,
|
|
252
|
+
description: 'Validates HSL color format (e.g. hsl(0, 100%, 50%))',
|
|
253
|
+
},
|
|
254
|
+
{
|
|
255
|
+
name: 'BASE64_REGEX',
|
|
256
|
+
regex: BASE64_REGEX,
|
|
257
|
+
description: 'Validates base64 encoded string (e.g. aGVsbG8gd29ybGQ=)',
|
|
258
|
+
},
|
|
259
|
+
{
|
|
260
|
+
name: 'BINARY_NUMBER_REGEX',
|
|
261
|
+
regex: BINARY_NUMBER_REGEX,
|
|
262
|
+
description: 'Validates binary number (e.g. 1010)',
|
|
263
|
+
},
|
|
264
|
+
{
|
|
265
|
+
name: 'HEXADECIMAL_NUMBER_REGEX',
|
|
266
|
+
regex: HEXADECIMAL_NUMBER_REGEX,
|
|
267
|
+
description: 'Validates hexadecimal number (e.g. 1A3F)',
|
|
268
|
+
},
|
|
269
|
+
{
|
|
270
|
+
name: 'ROMAN_NUMERALS_REGEX',
|
|
271
|
+
regex: ROMAN_NUMERALS_REGEX,
|
|
272
|
+
description: 'Validates Roman numerals (e.g. IV, X, MM)',
|
|
273
|
+
},
|
|
274
|
+
{
|
|
275
|
+
name: 'CURRENCY_GENERIC_REGEX',
|
|
276
|
+
regex: CURRENCY_GENERIC_REGEX,
|
|
277
|
+
description: 'Validates generic currency format (e.g. $123.45)',
|
|
278
|
+
},
|
|
279
|
+
{
|
|
280
|
+
name: 'LINKEDIN_PROFILE_REGEX',
|
|
281
|
+
regex: LINKEDIN_PROFILE_REGEX,
|
|
282
|
+
description:
|
|
283
|
+
'Validates LinkedIn profile URL (e.g. https://www.linkedin.com/in/username)',
|
|
284
|
+
},
|
|
285
|
+
{
|
|
286
|
+
name: 'TWITTER_HANDLE_REGEX',
|
|
287
|
+
regex: TWITTER_HANDLE_REGEX,
|
|
288
|
+
description: 'Validates Twitter handle (e.g. @username)',
|
|
289
|
+
},
|
|
290
|
+
];
|
|
291
|
+
|
|
292
|
+
const validateInput = () => {
|
|
293
|
+
const validator = validators.find(
|
|
294
|
+
(validator) => validator.name === selectedRegex
|
|
295
|
+
);
|
|
296
|
+
if (validator && validator.regex) {
|
|
297
|
+
const isValid = validator.regex.test(input);
|
|
298
|
+
setResult(isValid ? 'Valid input' : 'Invalid input');
|
|
299
|
+
} else {
|
|
300
|
+
setResult('No validator selected');
|
|
301
|
+
}
|
|
302
|
+
};
|
|
303
|
+
|
|
304
|
+
const handleRegexChange = (e) => {
|
|
305
|
+
setSelectedRegex(e.target.value);
|
|
306
|
+
setResult('');
|
|
307
|
+
};
|
|
308
|
+
|
|
309
|
+
const selectedValidator = validators.find(
|
|
310
|
+
(validator) => validator.name === selectedRegex
|
|
311
|
+
);
|
|
312
|
+
|
|
313
|
+
return (
|
|
314
|
+
<div style={{ padding: '20px', fontFamily: 'Arial, sans-serif' }}>
|
|
315
|
+
<h1>Validation Regex Playground</h1>
|
|
316
|
+
|
|
317
|
+
<select
|
|
318
|
+
value={selectedRegex}
|
|
319
|
+
onChange={handleRegexChange}
|
|
320
|
+
style={{ padding: '10px', width: '300px', marginRight: '10px' }}
|
|
321
|
+
>
|
|
322
|
+
<option value="">Select Regex</option>
|
|
323
|
+
{validators.map((validator) => (
|
|
324
|
+
<option key={validator.name} value={validator.name}>
|
|
325
|
+
{validator.name}
|
|
326
|
+
</option>
|
|
327
|
+
))}
|
|
328
|
+
</select>
|
|
329
|
+
|
|
330
|
+
{selectedValidator && (
|
|
331
|
+
<>
|
|
332
|
+
<p>
|
|
333
|
+
<b>{selectedValidator.name}</b>
|
|
334
|
+
</p>
|
|
335
|
+
<p style={{ fontStyle: 'italic' }}>{selectedValidator.description}</p>
|
|
336
|
+
</>
|
|
337
|
+
)}
|
|
338
|
+
|
|
339
|
+
<div style={{ marginTop: '20px' }}>
|
|
340
|
+
<input
|
|
341
|
+
type="text"
|
|
342
|
+
placeholder="Enter input to test"
|
|
343
|
+
value={input}
|
|
344
|
+
onChange={(e) => setInput(e.target.value)}
|
|
345
|
+
style={{ padding: '10px', width: '300px', marginRight: '10px' }}
|
|
346
|
+
/>
|
|
347
|
+
<button onClick={validateInput} style={{ padding: '10px' }}>
|
|
348
|
+
Validate
|
|
349
|
+
</button>
|
|
350
|
+
</div>
|
|
351
|
+
|
|
352
|
+
<div
|
|
353
|
+
style={{
|
|
354
|
+
marginTop: '20px',
|
|
355
|
+
color: result === 'Valid input' ? 'green' : 'red',
|
|
356
|
+
}}
|
|
357
|
+
>
|
|
358
|
+
{result}
|
|
359
|
+
</div>
|
|
360
|
+
</div>
|
|
361
|
+
);
|
|
362
|
+
};
|
|
@@ -0,0 +1,194 @@
|
|
|
1
|
+
// Validation Regex Collection
|
|
2
|
+
|
|
3
|
+
// Email Validation
|
|
4
|
+
const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
5
|
+
|
|
6
|
+
// URL Validation
|
|
7
|
+
const URL_REGEX = /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([\/\w.-]*)*\/?$/;
|
|
8
|
+
|
|
9
|
+
// Phone Number Validation
|
|
10
|
+
const PHONE_REGEX = /^\+?[\d\s\-()]{7,15}$/;
|
|
11
|
+
|
|
12
|
+
// Postal Code Validation (Generic)
|
|
13
|
+
const POSTAL_CODE_REGEX = /^[A-Za-z\d\s\-]{3,10}$/;
|
|
14
|
+
|
|
15
|
+
// IPv4 Address Validation
|
|
16
|
+
const IPV4_REGEX =
|
|
17
|
+
/^((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
|
|
18
|
+
|
|
19
|
+
// IPv6 Address Validation
|
|
20
|
+
const IPV6_REGEX = /^(?:[a-fA-F0-9]{1,4}:){7}[a-fA-F0-9]{1,4}$/;
|
|
21
|
+
|
|
22
|
+
// Hexadecimal Color Code Validation
|
|
23
|
+
const HEX_COLOR_REGEX = /^#([A-Fa-f0-9]{3}|[A-Fa-f0-9]{6})$/;
|
|
24
|
+
|
|
25
|
+
// Password Validation (At least 8 chars, one letter, one number)
|
|
26
|
+
const PASSWORD_SIMPLE_REGEX = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/;
|
|
27
|
+
|
|
28
|
+
// Password Validation (At least 8 chars, one uppercase, one lowercase, one number, one special character)
|
|
29
|
+
const PASSWORD_COMPLEX_REGEX =
|
|
30
|
+
/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/;
|
|
31
|
+
|
|
32
|
+
// Only Alphabets Validation
|
|
33
|
+
const ALPHABET_ONLY_REGEX = /^[A-Za-z]+$/;
|
|
34
|
+
|
|
35
|
+
// Only Numbers Validation
|
|
36
|
+
const NUMBERS_ONLY_REGEX = /^\d+$/;
|
|
37
|
+
|
|
38
|
+
// Alphanumeric Validation
|
|
39
|
+
const ALPHANUMERIC_REGEX = /^[A-Za-z0-9]+$/;
|
|
40
|
+
|
|
41
|
+
// Date Validation (YYYY-MM-DD)
|
|
42
|
+
const DATE_REGEX = /^\d{4}-\d{2}-\d{2}$/;
|
|
43
|
+
|
|
44
|
+
// Time Validation (HH:MM:SS)
|
|
45
|
+
const TIME_REGEX = /^\d{2}:\d{2}:\d{2}$/;
|
|
46
|
+
|
|
47
|
+
// File Extension Validation (e.g., .jpg, .png, .gif, .bmp)
|
|
48
|
+
const FILE_EXTENSION_REGEX = /\.(jpg|png|gif|bmp)$/i;
|
|
49
|
+
|
|
50
|
+
// MAC Address Validation
|
|
51
|
+
const MAC_ADDRESS_REGEX = /^([0-9A-Fa-f]{2}[:-]){5}([0-9A-Fa-f]{2})$/;
|
|
52
|
+
|
|
53
|
+
// Credit Card Number Validation (Basic)
|
|
54
|
+
const CREDIT_CARD_REGEX = /^\d{4}-?\d{4}-?\d{4}-?\d{4}$/;
|
|
55
|
+
|
|
56
|
+
// Social Security Number (SSN) Validation (US Format)
|
|
57
|
+
const SSN_REGEX = /^\d{3}-\d{2}-\d{4}$/;
|
|
58
|
+
|
|
59
|
+
// UUID Validation
|
|
60
|
+
const UUID_REGEX =
|
|
61
|
+
/^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;
|
|
62
|
+
|
|
63
|
+
// HTML Tags Validation
|
|
64
|
+
const HTML_TAG_REGEX = /<\/?[\w\s=\"'\/\.:;#-]*>/g;
|
|
65
|
+
|
|
66
|
+
// Whitespace Validation (Leading or Trailing)
|
|
67
|
+
const WHITESPACE_REGEX = /^\s+|\s+$/g;
|
|
68
|
+
|
|
69
|
+
// US ZIP Code Validation (5 or 9 digits)
|
|
70
|
+
const US_ZIP_CODE_REGEX = /^\d{5}(-\d{4})?$/;
|
|
71
|
+
|
|
72
|
+
// Username Validation (Alphanumeric, underscores, 3-16 characters)
|
|
73
|
+
const USERNAME_REGEX = /^[a-zA-Z0-9_]{3,16}$/;
|
|
74
|
+
|
|
75
|
+
// Indian Specific Validations
|
|
76
|
+
|
|
77
|
+
// Indian Phone Number Validation
|
|
78
|
+
const INDIAN_PHONE_REGEX = /^[6-9]\d{9}$/;
|
|
79
|
+
|
|
80
|
+
// Indian PIN Code Validation
|
|
81
|
+
const INDIAN_PIN_CODE_REGEX = /^\d{6}$/;
|
|
82
|
+
|
|
83
|
+
// GSTIN Validation
|
|
84
|
+
const GSTIN_REGEX = /^\d{2}[A-Z]{5}\d{4}[A-Z]{1}[A-Z\d]{1}[Z]{1}[A-Z\d]{1}$/;
|
|
85
|
+
|
|
86
|
+
// PAN Card Validation
|
|
87
|
+
const PAN_CARD_REGEX = /^[A-Z]{5}\d{4}[A-Z]{1}$/;
|
|
88
|
+
|
|
89
|
+
// Aadhaar Number Validation
|
|
90
|
+
const AADHAAR_REGEX = /^\d{12}$/;
|
|
91
|
+
|
|
92
|
+
// Vehicle Registration Validation
|
|
93
|
+
const VEHICLE_REGISTRATION_REGEX = /^[A-Z]{2}\d{2}[A-Z]{0,2}\d{4}$/;
|
|
94
|
+
|
|
95
|
+
// Indian Currency Format Validation
|
|
96
|
+
const INDIAN_CURRENCY_REGEX = /^\u20B9?\s?\d{1,3}(,\d{3})*(\.\d{1,2})?$/;
|
|
97
|
+
|
|
98
|
+
// Additional Generic and Specific Validations
|
|
99
|
+
|
|
100
|
+
// International Phone Number Validation
|
|
101
|
+
const INTERNATIONAL_PHONE_REGEX = /^\+?[1-9]\d{1,14}$/;
|
|
102
|
+
|
|
103
|
+
// Passport Number Validation (India)
|
|
104
|
+
const INDIAN_PASSPORT_REGEX = /^[A-Z]{1}-?\d{7}$/;
|
|
105
|
+
|
|
106
|
+
// Driving License Validation (India)
|
|
107
|
+
const DRIVING_LICENSE_REGEX = /^[A-Z]{2}-\d{2}-\d{4}-\d{7}$/;
|
|
108
|
+
|
|
109
|
+
// Username with Special Characters
|
|
110
|
+
const USERNAME_SPECIAL_REGEX = /^[a-zA-Z0-9._-]{3,16}$/;
|
|
111
|
+
|
|
112
|
+
// Decimal Number Validation
|
|
113
|
+
const DECIMAL_NUMBER_REGEX = /^-?\d+(\.\d+)?$/;
|
|
114
|
+
|
|
115
|
+
// HTML Attributes Validation
|
|
116
|
+
const HTML_ATTRIBUTE_REGEX = /\b[a-zA-Z-]+(="[^"]*"|='[^']*'|=[^\s>]*)?/g;
|
|
117
|
+
|
|
118
|
+
// RGB Color Code Validation
|
|
119
|
+
const RGB_COLOR_REGEX = /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/;
|
|
120
|
+
|
|
121
|
+
// HSL Color Code Validation
|
|
122
|
+
const HSL_COLOR_REGEX = /^hsl\((\d{1,3}),\s*(\d{1,3})%,\s*(\d{1,3})%\)$/;
|
|
123
|
+
|
|
124
|
+
// Base64 String Validation
|
|
125
|
+
const BASE64_REGEX =
|
|
126
|
+
/^(?:[A-Za-z0-9+\/]{4})*(?:[A-Za-z0-9+\/]{2}==|[A-Za-z0-9+\/]{3}=)?$/;
|
|
127
|
+
|
|
128
|
+
// Binary Number Validation
|
|
129
|
+
const BINARY_NUMBER_REGEX = /^[01]+$/;
|
|
130
|
+
|
|
131
|
+
// Hexadecimal Number Validation
|
|
132
|
+
const HEXADECIMAL_NUMBER_REGEX = /^[0-9A-Fa-f]+$/;
|
|
133
|
+
|
|
134
|
+
// Roman Numerals Validation
|
|
135
|
+
const ROMAN_NUMERALS_REGEX =
|
|
136
|
+
/^(?=[MDCLXVI])M*(C[MD]|D?C{0,3})(X[CL]|L?X{0,3})(I[XV]|V?I{0,3})$/;
|
|
137
|
+
|
|
138
|
+
// Currency Validation (Generic)
|
|
139
|
+
const CURRENCY_GENERIC_REGEX = /^[\u0024-\u20B9]?\d+(,\d{3})*(\.\d{1,2})?$/;
|
|
140
|
+
|
|
141
|
+
// LinkedIn Profile URL Validation
|
|
142
|
+
const LINKEDIN_PROFILE_REGEX =
|
|
143
|
+
/^https?:\/\/(www\.)?linkedin\.com\/in\/([a-zA-Z0-9-]{5,30})$/;
|
|
144
|
+
|
|
145
|
+
// Twitter Handle Validation
|
|
146
|
+
const TWITTER_HANDLE_REGEX = /^@?([a-zA-Z0-9_]{1,15})$/;
|
|
147
|
+
|
|
148
|
+
export {
|
|
149
|
+
EMAIL_REGEX,
|
|
150
|
+
URL_REGEX,
|
|
151
|
+
PHONE_REGEX,
|
|
152
|
+
POSTAL_CODE_REGEX,
|
|
153
|
+
IPV4_REGEX,
|
|
154
|
+
IPV6_REGEX,
|
|
155
|
+
HEX_COLOR_REGEX,
|
|
156
|
+
PASSWORD_SIMPLE_REGEX,
|
|
157
|
+
PASSWORD_COMPLEX_REGEX,
|
|
158
|
+
ALPHABET_ONLY_REGEX,
|
|
159
|
+
NUMBERS_ONLY_REGEX,
|
|
160
|
+
ALPHANUMERIC_REGEX,
|
|
161
|
+
DATE_REGEX,
|
|
162
|
+
TIME_REGEX,
|
|
163
|
+
FILE_EXTENSION_REGEX,
|
|
164
|
+
MAC_ADDRESS_REGEX,
|
|
165
|
+
CREDIT_CARD_REGEX,
|
|
166
|
+
SSN_REGEX,
|
|
167
|
+
UUID_REGEX,
|
|
168
|
+
HTML_TAG_REGEX,
|
|
169
|
+
WHITESPACE_REGEX,
|
|
170
|
+
US_ZIP_CODE_REGEX,
|
|
171
|
+
USERNAME_REGEX,
|
|
172
|
+
INDIAN_PHONE_REGEX,
|
|
173
|
+
INDIAN_PIN_CODE_REGEX,
|
|
174
|
+
GSTIN_REGEX,
|
|
175
|
+
PAN_CARD_REGEX,
|
|
176
|
+
AADHAAR_REGEX,
|
|
177
|
+
VEHICLE_REGISTRATION_REGEX,
|
|
178
|
+
INDIAN_CURRENCY_REGEX,
|
|
179
|
+
INTERNATIONAL_PHONE_REGEX,
|
|
180
|
+
INDIAN_PASSPORT_REGEX,
|
|
181
|
+
DRIVING_LICENSE_REGEX,
|
|
182
|
+
USERNAME_SPECIAL_REGEX,
|
|
183
|
+
DECIMAL_NUMBER_REGEX,
|
|
184
|
+
HTML_ATTRIBUTE_REGEX,
|
|
185
|
+
RGB_COLOR_REGEX,
|
|
186
|
+
HSL_COLOR_REGEX,
|
|
187
|
+
BASE64_REGEX,
|
|
188
|
+
BINARY_NUMBER_REGEX,
|
|
189
|
+
HEXADECIMAL_NUMBER_REGEX,
|
|
190
|
+
ROMAN_NUMERALS_REGEX,
|
|
191
|
+
CURRENCY_GENERIC_REGEX,
|
|
192
|
+
LINKEDIN_PROFILE_REGEX,
|
|
193
|
+
TWITTER_HANDLE_REGEX,
|
|
194
|
+
};
|