@salutejs/plasma-new-hope 0.194.0-canary.1562.11857238836.0 → 0.194.0-canary.1565.11870784206.0
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/cjs/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/cjs/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js.map +1 -1
- package/cjs/components/Combobox/ComboboxOld/Combobox.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxDivider/ComboboxDivider.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxFooter/ComboboxFooter.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxGroup/ComboboxGroup.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxHeader/ComboboxHeader.css +4 -5
- package/cjs/components/Dropdown/Dropdown.css +4 -5
- package/cjs/components/Dropdown/Dropdown.js +2 -4
- package/cjs/components/Dropdown/Dropdown.js.map +1 -1
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.css +4 -5
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js +2 -3
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js.map +1 -1
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +1 -7
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js.map +1 -1
- package/cjs/components/Dropdown/ui/DropdownItem/{DropdownItem.styles_14yih1y.css → DropdownItem.styles_1b439rx.css} +0 -1
- package/cjs/components/Select/Select.js +1 -0
- package/cjs/components/Select/Select.js.map +1 -1
- package/cjs/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/cjs/components/Select/ui/Inner/ui/Item/Item.js.map +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -18
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/cjs/components/TextField/TextField.js +27 -3
- package/cjs/components/TextField/TextField.js.map +1 -1
- package/cjs/components/TextField/hooks/useValidation.js +273 -0
- package/cjs/components/TextField/hooks/useValidation.js.map +1 -0
- package/cjs/index.css +4 -5
- package/cjs/utils/constants.js +4 -0
- package/cjs/utils/constants.js.map +1 -1
- package/emotion/cjs/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/emotion/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/cjs/components/Dropdown/Dropdown.js +2 -4
- package/emotion/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js +2 -3
- package/emotion/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +11 -15
- package/emotion/cjs/components/Select/Select.js +1 -0
- package/emotion/cjs/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/emotion/cjs/components/TextField/TextField.js +27 -4
- package/emotion/cjs/components/TextField/TextField.template-doc.mdx +330 -0
- package/emotion/cjs/components/TextField/hooks/index.js +8 -1
- package/emotion/cjs/components/TextField/hooks/useValidation.js +276 -0
- package/emotion/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +253 -1
- package/emotion/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +252 -0
- package/emotion/cjs/utils/constants.js +4 -2
- package/emotion/es/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/emotion/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/es/components/Dropdown/Dropdown.js +2 -4
- package/emotion/es/components/Dropdown/ui/DropdownItem/DropdownItem.js +3 -4
- package/emotion/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +11 -15
- package/emotion/es/components/Select/Select.js +1 -0
- package/emotion/es/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/emotion/es/components/TextField/TextField.js +28 -5
- package/emotion/es/components/TextField/TextField.template-doc.mdx +330 -0
- package/emotion/es/components/TextField/hooks/index.js +2 -1
- package/emotion/es/components/TextField/hooks/useValidation.js +270 -0
- package/emotion/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +253 -1
- package/emotion/es/examples/plasma_web/components/TextField/TextField.stories.tsx +252 -0
- package/emotion/es/utils/constants.js +3 -1
- package/es/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/es/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js.map +1 -1
- package/es/components/Combobox/ComboboxOld/Combobox.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxDivider/ComboboxDivider.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxFooter/ComboboxFooter.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxGroup/ComboboxGroup.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxHeader/ComboboxHeader.css +4 -5
- package/es/components/Dropdown/Dropdown.css +4 -5
- package/es/components/Dropdown/Dropdown.js +2 -4
- package/es/components/Dropdown/Dropdown.js.map +1 -1
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.css +4 -5
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.js +3 -4
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.js.map +1 -1
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +2 -7
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js.map +1 -1
- package/es/components/Dropdown/ui/DropdownItem/{DropdownItem.styles_14yih1y.css → DropdownItem.styles_1b439rx.css} +0 -1
- package/es/components/Select/Select.js +1 -0
- package/es/components/Select/Select.js.map +1 -1
- package/es/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/es/components/Select/ui/Inner/ui/Item/Item.js.map +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js +4 -19
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/es/components/TextField/TextField.js +27 -3
- package/es/components/TextField/TextField.js.map +1 -1
- package/es/components/TextField/hooks/useValidation.js +269 -0
- package/es/components/TextField/hooks/useValidation.js.map +1 -0
- package/es/index.css +4 -5
- package/es/utils/constants.js +3 -1
- package/es/utils/constants.js.map +1 -1
- package/package.json +2 -3
- package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/styled-components/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/cjs/components/Dropdown/Dropdown.js +2 -4
- package/styled-components/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js +2 -3
- package/styled-components/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +2 -5
- package/styled-components/cjs/components/Select/Select.js +1 -0
- package/styled-components/cjs/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/styled-components/cjs/components/TextField/TextField.js +26 -3
- package/styled-components/cjs/components/TextField/TextField.template-doc.mdx +330 -0
- package/styled-components/cjs/components/TextField/hooks/index.js +8 -1
- package/styled-components/cjs/components/TextField/hooks/useValidation.js +276 -0
- package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +253 -1
- package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +252 -0
- package/styled-components/cjs/utils/constants.js +4 -2
- package/styled-components/es/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/styled-components/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/es/components/Dropdown/Dropdown.js +2 -4
- package/styled-components/es/components/Dropdown/ui/DropdownItem/DropdownItem.js +3 -4
- package/styled-components/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +2 -5
- package/styled-components/es/components/Select/Select.js +1 -0
- package/styled-components/es/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/styled-components/es/components/TextField/TextField.js +27 -4
- package/styled-components/es/components/TextField/TextField.template-doc.mdx +330 -0
- package/styled-components/es/components/TextField/hooks/index.js +2 -1
- package/styled-components/es/components/TextField/hooks/useValidation.js +270 -0
- package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +253 -1
- package/styled-components/es/examples/plasma_web/components/TextField/TextField.stories.tsx +252 -0
- package/styled-components/es/utils/constants.js +3 -1
- package/types/components/Autocomplete/Autocomplete.types.d.ts +2 -2
- package/types/components/Autocomplete/Autocomplete.types.d.ts.map +1 -1
- package/types/components/Autocomplete/ui/TextField/TextField.styles.d.ts +1676 -92
- package/types/components/Autocomplete/ui/TextField/TextField.styles.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/Combobox.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts +2 -1
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/ui/Target/Target.styles.d.ts +1676 -92
- package/types/components/Combobox/ComboboxNew/ui/Target/Target.styles.d.ts.map +1 -1
- package/types/components/DatePicker/SingleDate/SingleDate.styles.d.ts +1676 -92
- package/types/components/DatePicker/SingleDate/SingleDate.styles.d.ts.map +1 -1
- package/types/components/Dropdown/Dropdown.d.ts +2 -50
- package/types/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/types/components/Dropdown/Dropdown.types.d.ts +6 -11
- package/types/components/Dropdown/Dropdown.types.d.ts.map +1 -1
- package/types/components/Dropdown/index.d.ts +0 -1
- package/types/components/Dropdown/index.d.ts.map +1 -1
- package/types/components/Dropdown/ui/DropdownItem/DropdownItem.d.ts.map +1 -1
- package/types/components/Dropdown/ui/DropdownItem/DropdownItem.styles.d.ts +0 -1
- package/types/components/Dropdown/ui/DropdownItem/DropdownItem.styles.d.ts.map +1 -1
- package/types/components/Range/Range.styles.d.ts +1676 -92
- package/types/components/Range/Range.styles.d.ts.map +1 -1
- package/types/components/Select/Select.d.ts.map +1 -1
- package/types/components/Select/Select.types.d.ts +2 -1
- package/types/components/Select/Select.types.d.ts.map +1 -1
- package/types/components/Select/ui/Inner/ui/Item/Item.d.ts.map +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.d.ts.map +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.styles.d.ts +1676 -92
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.styles.d.ts.map +1 -1
- package/types/components/Slider/components/Double/Double.styles.d.ts +1676 -92
- package/types/components/Slider/components/Double/Double.styles.d.ts.map +1 -1
- package/types/components/TextField/TextField.d.ts.map +1 -1
- package/types/components/TextField/TextField.types.d.ts +51 -1
- package/types/components/TextField/TextField.types.d.ts.map +1 -1
- package/types/components/TextField/hooks/index.d.ts +1 -0
- package/types/components/TextField/hooks/index.d.ts.map +1 -1
- package/types/components/TextField/hooks/useValidation.d.ts +7 -0
- package/types/components/TextField/hooks/useValidation.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.d.ts +64 -2
- package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Dropdown/Dropdown.d.ts +1 -25
- package/types/examples/plasma_b2c/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Mask/Mask.d.ts +2732 -92
- package/types/examples/plasma_b2c/components/Mask/Mask.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/TextField/TextField.d.ts +1676 -92
- package/types/examples/plasma_b2c/components/TextField/TextField.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Autocomplete/Autocomplete.d.ts +64 -2
- package/types/examples/plasma_web/components/Autocomplete/Autocomplete.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Dropdown/Dropdown.d.ts +1 -25
- package/types/examples/plasma_web/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Mask/Mask.d.ts +2732 -92
- package/types/examples/plasma_web/components/Mask/Mask.d.ts.map +1 -1
- package/types/examples/plasma_web/components/TextField/TextField.d.ts +1676 -92
- package/types/examples/plasma_web/components/TextField/TextField.d.ts.map +1 -1
- package/types/utils/constants.d.ts +2 -0
- package/types/utils/constants.d.ts.map +1 -1
@@ -5,6 +5,9 @@ title: TextField
|
|
5
5
|
|
6
6
|
import { PropsTable, Description } from '@site/src/components';
|
7
7
|
|
8
|
+
import Tabs from '@theme/Tabs';
|
9
|
+
import TabItem from '@theme/TabItem';
|
10
|
+
|
8
11
|
# TextField
|
9
12
|
<Description name="TextField" />
|
10
13
|
<PropsTable name="TextField" exclude={['$isFocused']} />
|
@@ -198,3 +201,330 @@ export function App() {
|
|
198
201
|
);
|
199
202
|
}
|
200
203
|
```
|
204
|
+
|
205
|
+
### Валидация
|
206
|
+
Поддерживается валидация почты и пароля:
|
207
|
+
|
208
|
+
<Tabs>
|
209
|
+
<TabItem value="email" label="Email" default>
|
210
|
+
Свойства доступные при валидации почты:
|
211
|
+
```tsx
|
212
|
+
type ValidationProps = {
|
213
|
+
/*
|
214
|
+
* Тип валидации
|
215
|
+
*/
|
216
|
+
validationType: 'email';
|
217
|
+
/*
|
218
|
+
* Опции валидации
|
219
|
+
*/
|
220
|
+
options?: EmailValidationOptions;
|
221
|
+
/*
|
222
|
+
* Функция, вызываемая при валидации значения.
|
223
|
+
* Вызывается при событии onBlur и по нажатию Enter, когда фокус на поле ввода
|
224
|
+
*/
|
225
|
+
onValidate?: (args: OnValidateArgs) => void;
|
226
|
+
}
|
227
|
+
```
|
228
|
+
Свойство `options` имеет следующий вид:
|
229
|
+
```tsx
|
230
|
+
type EmailValidationOptions = {
|
231
|
+
/*
|
232
|
+
* Пользовательское регулярное выражение, для проверки почты на валидность
|
233
|
+
*/
|
234
|
+
customEmailRegex?: {
|
235
|
+
value?: RegExp;
|
236
|
+
errorMessage?: string;
|
237
|
+
};
|
238
|
+
/*
|
239
|
+
* Минимальная длина почты
|
240
|
+
*/
|
241
|
+
minLength?: {
|
242
|
+
value?: number;
|
243
|
+
errorMessage?: string;
|
244
|
+
};
|
245
|
+
/*
|
246
|
+
* Максимальная длина почты
|
247
|
+
*/
|
248
|
+
maxLength?: {
|
249
|
+
value?: number;
|
250
|
+
errorMessage?: string;
|
251
|
+
};
|
252
|
+
/*
|
253
|
+
* Минимальная длина хоста (часть почты до `@`)
|
254
|
+
*/
|
255
|
+
minHostLength?: {
|
256
|
+
value?: number;
|
257
|
+
errorMessage?: string;
|
258
|
+
};
|
259
|
+
/*
|
260
|
+
* Максимальная длина хоста (часть почты до `@`)
|
261
|
+
*/
|
262
|
+
maxHostLength?: {
|
263
|
+
value?: number;
|
264
|
+
errorMessage?: string;
|
265
|
+
};
|
266
|
+
/*
|
267
|
+
* Минимальная длина домена (часть почты от `@` до `.` перед доменной зоной)
|
268
|
+
*/
|
269
|
+
minDomainLength?: {
|
270
|
+
value?: number;
|
271
|
+
errorMessage?: string;
|
272
|
+
};
|
273
|
+
/*
|
274
|
+
* Максимальная длина домена (часть почты от `@` до `.` перед доменной зоной)
|
275
|
+
*/
|
276
|
+
maxDomainLength?: {
|
277
|
+
value?: number;
|
278
|
+
errorMessage?: string;
|
279
|
+
};
|
280
|
+
/*
|
281
|
+
* Минимальная длина доменной зоны (часть почты от `.`; например `ru`, `com`...)
|
282
|
+
*/
|
283
|
+
minZoneLength?: {
|
284
|
+
value?: number;
|
285
|
+
errorMessage?: string;
|
286
|
+
};
|
287
|
+
/*
|
288
|
+
* Максимальная длина доменной зоны (часть почты от `.`; например `ru`, `com`...)
|
289
|
+
*/
|
290
|
+
maxZoneLength?: {
|
291
|
+
value?: number;
|
292
|
+
errorMessage?: string;
|
293
|
+
};
|
294
|
+
/*
|
295
|
+
* Список разрешенных доменов (например `['mail.ru', 'yahoo.ru', 'gmail.com']`)
|
296
|
+
*/
|
297
|
+
whitelistDomains?: {
|
298
|
+
value?: string[];
|
299
|
+
errorMessage?: string;
|
300
|
+
};
|
301
|
+
/*
|
302
|
+
* Список запрещенных доменов (например `['org.biz', 'expressmail.com']`)
|
303
|
+
*/
|
304
|
+
blacklistDomains?: {
|
305
|
+
value?: string[];
|
306
|
+
errorMessage?: string;
|
307
|
+
};
|
308
|
+
};
|
309
|
+
```
|
310
|
+
|
311
|
+
```tsx live
|
312
|
+
import React, { useState } from 'react';
|
313
|
+
import { TextField } from '@salutejs/{{ package }}';
|
314
|
+
|
315
|
+
export function App() {
|
316
|
+
const options = {
|
317
|
+
minLength: {
|
318
|
+
value: 7,
|
319
|
+
errorMessage: 'Почта слишком короткая',
|
320
|
+
},
|
321
|
+
maxLength: {
|
322
|
+
value: 30,
|
323
|
+
errorMessage: 'Почта слишком длинная',
|
324
|
+
},
|
325
|
+
minHostLength: {
|
326
|
+
value: 2,
|
327
|
+
errorMessage: 'Хост слишком короткий',
|
328
|
+
},
|
329
|
+
maxHostLength: {
|
330
|
+
value: 12,
|
331
|
+
errorMessage: 'Хост слишком длинный',
|
332
|
+
},
|
333
|
+
minDomainLength: {
|
334
|
+
value: 3,
|
335
|
+
errorMessage: 'Домен слишком короткий',
|
336
|
+
},
|
337
|
+
maxDomainLength: {
|
338
|
+
value: 6,
|
339
|
+
errorMessage: 'Домен слишком длинный',
|
340
|
+
},
|
341
|
+
minZoneLength: {
|
342
|
+
value: 2,
|
343
|
+
errorMessage: 'Доменная зона слишком короткая',
|
344
|
+
},
|
345
|
+
maxZoneLength: {
|
346
|
+
value: 5,
|
347
|
+
errorMessage: 'Доменная зона слишком длинная',
|
348
|
+
},
|
349
|
+
whitelistDomains: {
|
350
|
+
value: ['plasma.ru', 'gmail.com', 'mail.ru'],
|
351
|
+
errorMessage: 'Домен не разрешен',
|
352
|
+
},
|
353
|
+
blacklistDomains: {
|
354
|
+
value: ['hah.ah', 'heh.eh'],
|
355
|
+
errorMessage: 'Домен запрещен',
|
356
|
+
},
|
357
|
+
};
|
358
|
+
|
359
|
+
const [error, setError] = useState('');
|
360
|
+
|
361
|
+
const handleOnChange = () => {
|
362
|
+
setError('');
|
363
|
+
};
|
364
|
+
|
365
|
+
const handleOnValidate = ({ errorMessage }: { errorMessage?: string }) => {
|
366
|
+
setError(errorMessage || '');
|
367
|
+
};
|
368
|
+
|
369
|
+
return (
|
370
|
+
<div>
|
371
|
+
<TextField
|
372
|
+
label="Валидация почты"
|
373
|
+
placeholder="Заполните поле"
|
374
|
+
validationType="email"
|
375
|
+
options={options}
|
376
|
+
view={error ? 'negative' : 'default}
|
377
|
+
helperText={error || 'Валидация почты'}
|
378
|
+
onChange={handleOnChange}
|
379
|
+
onValidate={handleOnValidate}
|
380
|
+
/>
|
381
|
+
</div>
|
382
|
+
);
|
383
|
+
}
|
384
|
+
```
|
385
|
+
</TabItem>
|
386
|
+
|
387
|
+
<TabItem value="password" label="Password" default>
|
388
|
+
Свойства доступные при валидации пароля:
|
389
|
+
```tsx
|
390
|
+
type ValidationProps = {
|
391
|
+
/*
|
392
|
+
* Тип валидации
|
393
|
+
*/
|
394
|
+
validationType: 'password';
|
395
|
+
/*
|
396
|
+
* Опции валидации
|
397
|
+
*/
|
398
|
+
options?: PasswordValidationOptions;
|
399
|
+
/*
|
400
|
+
* Состояние сокрытия оригинального пароля
|
401
|
+
*/
|
402
|
+
passwordHidden?: boolean;
|
403
|
+
/*
|
404
|
+
* Функция, вызываемая при валидации значения.
|
405
|
+
* Вызывается при событии onBlur и по нажатию Enter, когда фокус на поле ввода
|
406
|
+
*/
|
407
|
+
onValidate?: (args: OnValidateArgs) => void;
|
408
|
+
}
|
409
|
+
```
|
410
|
+
Свойство `options` имеет следующий вид:
|
411
|
+
```tsx
|
412
|
+
type PasswordValidationOptions = {
|
413
|
+
/*
|
414
|
+
* Минимальная длина пароля
|
415
|
+
*/
|
416
|
+
minLength?: {
|
417
|
+
value?: number;
|
418
|
+
errorMessage?: string;
|
419
|
+
};
|
420
|
+
/*
|
421
|
+
* Максимальная длина пароля
|
422
|
+
*/
|
423
|
+
maxLength?: {
|
424
|
+
value?: number;
|
425
|
+
errorMessage?: string;
|
426
|
+
};
|
427
|
+
/*
|
428
|
+
* Должны ли быть буквы верхнего регистра в пароле
|
429
|
+
*/
|
430
|
+
includeUppercase?: {
|
431
|
+
value?: boolean;
|
432
|
+
errorMessage?: string;
|
433
|
+
};
|
434
|
+
/*
|
435
|
+
* Должны ли быть буквы нижнего регистра в пароле
|
436
|
+
*/
|
437
|
+
includeLowercase?: {
|
438
|
+
value?: boolean;
|
439
|
+
errorMessage?: string;
|
440
|
+
};
|
441
|
+
/*
|
442
|
+
* Должны ли быть цифры в пароле
|
443
|
+
*/
|
444
|
+
includeDigits?: {
|
445
|
+
value?: boolean;
|
446
|
+
errorMessage?: string;
|
447
|
+
};
|
448
|
+
/*
|
449
|
+
* Должны ли быть специальные символы в пароле
|
450
|
+
*/
|
451
|
+
includeSpecialSymbols?: {
|
452
|
+
value?: boolean;
|
453
|
+
errorMessage?: string;
|
454
|
+
};
|
455
|
+
};
|
456
|
+
```
|
457
|
+
|
458
|
+
```tsx live
|
459
|
+
import React, { useState } from 'react';
|
460
|
+
import { TextField, IconButton } from '@salutejs/{{ package }}';
|
461
|
+
import { IconEyeFill, IconEyeClosedFill } from '@salutejs/plasma-icons';
|
462
|
+
|
463
|
+
export function App() {
|
464
|
+
const options = {
|
465
|
+
minLength: {
|
466
|
+
value: 5,
|
467
|
+
errorMessage: 'Пароль слишком короткий',
|
468
|
+
},
|
469
|
+
maxLength: {
|
470
|
+
value: 20,
|
471
|
+
errorMessage: 'Пароль слишком длинный',
|
472
|
+
},
|
473
|
+
includeUppercase: {
|
474
|
+
value: true,
|
475
|
+
errorMessage: 'Пароль должен содержать хотя бы одну заглавную букву',
|
476
|
+
},
|
477
|
+
includeLowercase: {
|
478
|
+
value: true,
|
479
|
+
errorMessage: 'Пароль должен содержать хотя бы одну строчную букву',
|
480
|
+
},
|
481
|
+
includeDigits: {
|
482
|
+
value: true,
|
483
|
+
errorMessage: 'Пароль должен содержать хотя бы одну цифру',
|
484
|
+
},
|
485
|
+
includeSpecialSymbols: {
|
486
|
+
value: true,
|
487
|
+
errorMessage: 'Пароль должен содержать хотя бы один специальный символ',
|
488
|
+
},
|
489
|
+
};
|
490
|
+
|
491
|
+
const [error, setError] = useState('');
|
492
|
+
const [hidden, setHidden] = useState(false);
|
493
|
+
|
494
|
+
const handleOnChange = () => {
|
495
|
+
setError('');
|
496
|
+
};
|
497
|
+
|
498
|
+
const handleOnValidate = ({ errorMessage }: { errorMessage?: string }) => {
|
499
|
+
setError(errorMessage || '');
|
500
|
+
};
|
501
|
+
|
502
|
+
const toggleShowPassword = () => setHidden(!hidden);
|
503
|
+
|
504
|
+
const HideButton = () => (
|
505
|
+
<IconButton size="s" view="clear" onClick={toggleShowPassword}>
|
506
|
+
{hidden ? <IconEyeClosedFill size="xs" color="inherit" /> : <IconEyeFill size="xs" color="inherit" />}
|
507
|
+
</IconButton>
|
508
|
+
)
|
509
|
+
|
510
|
+
return (
|
511
|
+
<div>
|
512
|
+
<TextField
|
513
|
+
label="Валидация пароля"
|
514
|
+
placeholder="Заполните поле"
|
515
|
+
validationType="password"
|
516
|
+
options={options}
|
517
|
+
view={error ? 'negative' : 'default'}
|
518
|
+
leftHelper={error || 'Валидация пароля'}
|
519
|
+
onChange={handleOnChange}
|
520
|
+
onValidate={handleOnValidate}
|
521
|
+
passwordHidden={hidden}
|
522
|
+
contentLeft={<HideButton />}
|
523
|
+
/>
|
524
|
+
</div>
|
525
|
+
);
|
526
|
+
}
|
527
|
+
```
|
528
|
+
</TabItem>
|
529
|
+
</Tabs>
|
530
|
+
|
@@ -9,4 +9,11 @@ Object.defineProperty(exports, "useKeyNavigation", {
|
|
9
9
|
return _useKeyNavigation.useKeyNavigation;
|
10
10
|
}
|
11
11
|
});
|
12
|
-
|
12
|
+
Object.defineProperty(exports, "useValidation", {
|
13
|
+
enumerable: true,
|
14
|
+
get: function get() {
|
15
|
+
return _useValidation.useValidation;
|
16
|
+
}
|
17
|
+
});
|
18
|
+
var _useKeyNavigation = /*#__PURE__*/require("./useKeyNavigation");
|
19
|
+
var _useValidation = /*#__PURE__*/require("./useValidation");
|
@@ -0,0 +1,276 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.useValidation = void 0;
|
7
|
+
var _react = /*#__PURE__*/require("react");
|
8
|
+
var _utils = /*#__PURE__*/require("../../../utils");
|
9
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
10
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
11
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
12
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
13
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
14
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
15
|
+
var getUniqueKeys = function getUniqueKeys(lengthOptions) {
|
16
|
+
return lengthOptions.map(function (option) {
|
17
|
+
return option.replace(/min|max|Length/g, '');
|
18
|
+
});
|
19
|
+
};
|
20
|
+
var validateLenghtOptions = function validateLenghtOptions(options) {
|
21
|
+
var _options$minLength, _options$maxLength;
|
22
|
+
if (!options) {
|
23
|
+
return;
|
24
|
+
}
|
25
|
+
var minHash = Object.keys(options).filter(function (key) {
|
26
|
+
return key.startsWith('min');
|
27
|
+
});
|
28
|
+
var maxHash = Object.keys(options).filter(function (key) {
|
29
|
+
return key.startsWith('max');
|
30
|
+
});
|
31
|
+
var minMaxUniqueKeys = (minHash === null || minHash === void 0 ? void 0 : minHash.length) >= (maxHash === null || maxHash === void 0 ? void 0 : maxHash.length) ? getUniqueKeys(minHash) : getUniqueKeys(maxHash);
|
32
|
+
var globalMinValue = Number(options === null || options === void 0 || (_options$minLength = options.minLength) === null || _options$minLength === void 0 ? void 0 : _options$minLength.value);
|
33
|
+
var globalMaxValue = Number(options === null || options === void 0 || (_options$maxLength = options.maxLength) === null || _options$maxLength === void 0 ? void 0 : _options$maxLength.value);
|
34
|
+
if (globalMinValue <= 0) {
|
35
|
+
console.error('minLength must be more than 0');
|
36
|
+
}
|
37
|
+
if (globalMaxValue <= 0) {
|
38
|
+
console.error('maxLength must be more than 0');
|
39
|
+
}
|
40
|
+
if (globalMaxValue <= globalMinValue) {
|
41
|
+
console.error('maxLength must be more than minLength');
|
42
|
+
}
|
43
|
+
minMaxUniqueKeys.forEach(function (key) {
|
44
|
+
var _options$optionMinKey, _options$optionMaxKey;
|
45
|
+
var optionMinKey = "min".concat(key, "Length");
|
46
|
+
var optionMaxKey = "max".concat(key, "Length");
|
47
|
+
var minValue = Number(options === null || options === void 0 || (_options$optionMinKey = options[optionMinKey]) === null || _options$optionMinKey === void 0 ? void 0 : _options$optionMinKey.value);
|
48
|
+
var maxValue = Number(options === null || options === void 0 || (_options$optionMaxKey = options[optionMaxKey]) === null || _options$optionMaxKey === void 0 ? void 0 : _options$optionMaxKey.value);
|
49
|
+
if (!minValue || minValue <= 0) {
|
50
|
+
console.error("".concat(optionMinKey, " must be more than 0"));
|
51
|
+
}
|
52
|
+
if (!maxValue || maxValue <= 0) {
|
53
|
+
console.error("".concat(optionMaxKey, " must be more than 0"));
|
54
|
+
}
|
55
|
+
if (maxValue <= minValue) {
|
56
|
+
console.error("".concat(optionMaxKey, " must be more than ").concat(optionMinKey));
|
57
|
+
}
|
58
|
+
});
|
59
|
+
};
|
60
|
+
var validateWithLengthOptions = function validateWithLengthOptions(value, options, optionKey) {
|
61
|
+
var _options$optionMinKey2, _options$optionMaxKey2;
|
62
|
+
var optionMinKey = "min".concat(optionKey, "Length");
|
63
|
+
var optionMaxKey = "max".concat(optionKey, "Length");
|
64
|
+
var minValue = Number((_options$optionMinKey2 = options[optionMinKey]) === null || _options$optionMinKey2 === void 0 ? void 0 : _options$optionMinKey2.value);
|
65
|
+
var maxValue = Number((_options$optionMaxKey2 = options[optionMaxKey]) === null || _options$optionMaxKey2 === void 0 ? void 0 : _options$optionMaxKey2.value);
|
66
|
+
if (minValue && value.length < minValue) {
|
67
|
+
var _options$optionMinKey3;
|
68
|
+
return {
|
69
|
+
isValid: false,
|
70
|
+
errorMessage: ((_options$optionMinKey3 = options[optionMinKey]) === null || _options$optionMinKey3 === void 0 ? void 0 : _options$optionMinKey3.errorMessage) || "".concat(optionMinKey, " is too short")
|
71
|
+
};
|
72
|
+
}
|
73
|
+
if (maxValue && value.length > maxValue) {
|
74
|
+
var _options$optionMaxKey3;
|
75
|
+
return {
|
76
|
+
isValid: false,
|
77
|
+
errorMessage: ((_options$optionMaxKey3 = options[optionMaxKey]) === null || _options$optionMaxKey3 === void 0 ? void 0 : _options$optionMaxKey3.errorMessage) || "".concat(optionMaxKey, " is too long")
|
78
|
+
};
|
79
|
+
}
|
80
|
+
return {
|
81
|
+
isValid: true
|
82
|
+
};
|
83
|
+
};
|
84
|
+
var validateEmailDomainsLists = function validateEmailDomainsLists(blacklistDomains, whitelistDomains) {
|
85
|
+
if (!(blacklistDomains !== null && blacklistDomains !== void 0 && blacklistDomains.length) || !(whitelistDomains !== null && whitelistDomains !== void 0 && whitelistDomains.length)) {
|
86
|
+
return;
|
87
|
+
}
|
88
|
+
var uniqueDomains = new Set([].concat(_toConsumableArray(blacklistDomains), _toConsumableArray(whitelistDomains)));
|
89
|
+
if (uniqueDomains.size !== blacklistDomains.length + whitelistDomains.length) {
|
90
|
+
console.error('Blacklisted domains must not overlap whitelisted domains');
|
91
|
+
}
|
92
|
+
};
|
93
|
+
var validateWithDomainsLists = function validateWithDomainsLists(domainWithZone, options) {
|
94
|
+
var _options$whitelistDom, _options$blacklistDom, _options$blacklistDom2, _options$whitelistDom2;
|
95
|
+
if (!((_options$whitelistDom = options.whitelistDomains) !== null && _options$whitelistDom !== void 0 && (_options$whitelistDom = _options$whitelistDom.value) !== null && _options$whitelistDom !== void 0 && _options$whitelistDom.length) && !((_options$blacklistDom = options.blacklistDomains) !== null && _options$blacklistDom !== void 0 && (_options$blacklistDom = _options$blacklistDom.value) !== null && _options$blacklistDom !== void 0 && _options$blacklistDom.length)) {
|
96
|
+
return {
|
97
|
+
isValid: true
|
98
|
+
};
|
99
|
+
}
|
100
|
+
if (options !== null && options !== void 0 && (_options$blacklistDom2 = options.blacklistDomains) !== null && _options$blacklistDom2 !== void 0 && (_options$blacklistDom2 = _options$blacklistDom2.value) !== null && _options$blacklistDom2 !== void 0 && _options$blacklistDom2.includes(domainWithZone)) {
|
101
|
+
var _options$blacklistDom3;
|
102
|
+
return {
|
103
|
+
isValid: false,
|
104
|
+
errorMessage: ((_options$blacklistDom3 = options.blacklistDomains) === null || _options$blacklistDom3 === void 0 ? void 0 : _options$blacklistDom3.errorMessage) || 'Domain is blacklisted'
|
105
|
+
};
|
106
|
+
}
|
107
|
+
if (!(options !== null && options !== void 0 && (_options$whitelistDom2 = options.whitelistDomains) !== null && _options$whitelistDom2 !== void 0 && (_options$whitelistDom2 = _options$whitelistDom2.value) !== null && _options$whitelistDom2 !== void 0 && _options$whitelistDom2.includes(domainWithZone))) {
|
108
|
+
var _options$whitelistDom3;
|
109
|
+
return {
|
110
|
+
isValid: false,
|
111
|
+
errorMessage: ((_options$whitelistDom3 = options.whitelistDomains) === null || _options$whitelistDom3 === void 0 ? void 0 : _options$whitelistDom3.errorMessage) || 'Domain is not whitelisted'
|
112
|
+
};
|
113
|
+
}
|
114
|
+
return {
|
115
|
+
isValid: true
|
116
|
+
};
|
117
|
+
};
|
118
|
+
var validateEmail = function validateEmail(email, options) {
|
119
|
+
var _options$customEmailR, _options$minLength2, _options$maxLength2;
|
120
|
+
if (!email) {
|
121
|
+
return {
|
122
|
+
isValid: true
|
123
|
+
};
|
124
|
+
}
|
125
|
+
var emailRegex = (options === null || options === void 0 || (_options$customEmailR = options.customEmailRegex) === null || _options$customEmailR === void 0 ? void 0 : _options$customEmailR.value) || _utils.constants.emailPattern;
|
126
|
+
if (!emailRegex.test(email)) {
|
127
|
+
var _options$customEmailR2;
|
128
|
+
return {
|
129
|
+
isValid: false,
|
130
|
+
errorMessage: (options === null || options === void 0 || (_options$customEmailR2 = options.customEmailRegex) === null || _options$customEmailR2 === void 0 ? void 0 : _options$customEmailR2.errorMessage) || 'Invalid email'
|
131
|
+
};
|
132
|
+
}
|
133
|
+
if (!options) {
|
134
|
+
return {
|
135
|
+
isValid: true
|
136
|
+
};
|
137
|
+
}
|
138
|
+
if ((_options$minLength2 = options.minLength) !== null && _options$minLength2 !== void 0 && _options$minLength2.value && email.length < options.minLength.value) {
|
139
|
+
var _options$minLength3;
|
140
|
+
return {
|
141
|
+
isValid: false,
|
142
|
+
errorMessage: ((_options$minLength3 = options.minLength) === null || _options$minLength3 === void 0 ? void 0 : _options$minLength3.errorMessage) || 'Email is too short'
|
143
|
+
};
|
144
|
+
}
|
145
|
+
if ((_options$maxLength2 = options.maxLength) !== null && _options$maxLength2 !== void 0 && _options$maxLength2.value && email.length > options.maxLength.value) {
|
146
|
+
var _options$maxLength3;
|
147
|
+
return {
|
148
|
+
isValid: false,
|
149
|
+
errorMessage: ((_options$maxLength3 = options.maxLength) === null || _options$maxLength3 === void 0 ? void 0 : _options$maxLength3.errorMessage) || 'Email is too long'
|
150
|
+
};
|
151
|
+
}
|
152
|
+
var emailHost = email.split('@')[0];
|
153
|
+
var emailDomainWithZone = email.split('@')[1];
|
154
|
+
var emailZone = emailDomainWithZone.split('.').pop();
|
155
|
+
if (!(emailZone !== null && emailZone !== void 0 && emailZone.length)) {
|
156
|
+
var _options$customEmailR3;
|
157
|
+
return {
|
158
|
+
isValid: false,
|
159
|
+
errorMessage: ((_options$customEmailR3 = options.customEmailRegex) === null || _options$customEmailR3 === void 0 ? void 0 : _options$customEmailR3.errorMessage) || 'Invalid email'
|
160
|
+
};
|
161
|
+
}
|
162
|
+
var emailDomain = emailDomainWithZone.substring(0, emailDomainWithZone.length - (emailZone.length + 1));
|
163
|
+
var hostValidation = validateWithLengthOptions(emailHost, options, 'Host');
|
164
|
+
if (!hostValidation.isValid) {
|
165
|
+
return hostValidation;
|
166
|
+
}
|
167
|
+
var domainValidation = validateWithLengthOptions(emailDomain, options, 'Domain');
|
168
|
+
if (!domainValidation.isValid) {
|
169
|
+
return domainValidation;
|
170
|
+
}
|
171
|
+
var zoneValidation = validateWithLengthOptions(emailZone, options, 'Zone');
|
172
|
+
if (!zoneValidation.isValid) {
|
173
|
+
return zoneValidation;
|
174
|
+
}
|
175
|
+
var domainWithZoneValidation = validateWithDomainsLists(emailDomainWithZone, options);
|
176
|
+
if (!domainWithZoneValidation.isValid) {
|
177
|
+
return domainWithZoneValidation;
|
178
|
+
}
|
179
|
+
return {
|
180
|
+
isValid: true
|
181
|
+
};
|
182
|
+
};
|
183
|
+
var validatePassword = function validatePassword(password, options) {
|
184
|
+
var _options$minLength4, _options$maxLength4, _options$includeUpper, _options$includeLower, _options$includeDigit, _options$includeSpeci;
|
185
|
+
if (!password || !options) {
|
186
|
+
return {
|
187
|
+
isValid: true
|
188
|
+
};
|
189
|
+
}
|
190
|
+
if ((_options$minLength4 = options.minLength) !== null && _options$minLength4 !== void 0 && _options$minLength4.value && password.length < options.minLength.value) {
|
191
|
+
var _options$minLength5;
|
192
|
+
return {
|
193
|
+
isValid: false,
|
194
|
+
errorMessage: ((_options$minLength5 = options.minLength) === null || _options$minLength5 === void 0 ? void 0 : _options$minLength5.errorMessage) || 'Password is too short'
|
195
|
+
};
|
196
|
+
}
|
197
|
+
if ((_options$maxLength4 = options.maxLength) !== null && _options$maxLength4 !== void 0 && _options$maxLength4.value && password.length > options.maxLength.value) {
|
198
|
+
var _options$maxLength5;
|
199
|
+
return {
|
200
|
+
isValid: false,
|
201
|
+
errorMessage: ((_options$maxLength5 = options.maxLength) === null || _options$maxLength5 === void 0 ? void 0 : _options$maxLength5.errorMessage) || 'Password is too long'
|
202
|
+
};
|
203
|
+
}
|
204
|
+
var lowercasedPassword = password.toLowerCase();
|
205
|
+
var uppercasedPassword = password.toUpperCase();
|
206
|
+
if ((_options$includeUpper = options.includeUppercase) !== null && _options$includeUpper !== void 0 && _options$includeUpper.value && password === lowercasedPassword) {
|
207
|
+
var _options$includeUpper2;
|
208
|
+
return {
|
209
|
+
isValid: false,
|
210
|
+
errorMessage: ((_options$includeUpper2 = options.includeUppercase) === null || _options$includeUpper2 === void 0 ? void 0 : _options$includeUpper2.errorMessage) || 'Password must contain at least one uppercase letter'
|
211
|
+
};
|
212
|
+
}
|
213
|
+
if ((_options$includeLower = options.includeLowercase) !== null && _options$includeLower !== void 0 && _options$includeLower.value && password === uppercasedPassword) {
|
214
|
+
var _options$includeLower2;
|
215
|
+
return {
|
216
|
+
isValid: false,
|
217
|
+
errorMessage: ((_options$includeLower2 = options.includeLowercase) === null || _options$includeLower2 === void 0 ? void 0 : _options$includeLower2.errorMessage) || 'Password must contain at least one lowercase letter'
|
218
|
+
};
|
219
|
+
}
|
220
|
+
if ((_options$includeDigit = options.includeDigits) !== null && _options$includeDigit !== void 0 && _options$includeDigit.value && !/\d/.test(password)) {
|
221
|
+
var _options$includeDigit2;
|
222
|
+
return {
|
223
|
+
isValid: false,
|
224
|
+
errorMessage: ((_options$includeDigit2 = options.includeDigits) === null || _options$includeDigit2 === void 0 ? void 0 : _options$includeDigit2.errorMessage) || 'Password must contain digits'
|
225
|
+
};
|
226
|
+
}
|
227
|
+
if ((_options$includeSpeci = options.includeSpecialSymbols) !== null && _options$includeSpeci !== void 0 && _options$includeSpeci.value && !_utils.constants.specialCharacters.test(password)) {
|
228
|
+
var _options$includeSpeci2;
|
229
|
+
return {
|
230
|
+
isValid: false,
|
231
|
+
errorMessage: ((_options$includeSpeci2 = options.includeSpecialSymbols) === null || _options$includeSpeci2 === void 0 ? void 0 : _options$includeSpeci2.errorMessage) || 'Password must contain special characters'
|
232
|
+
};
|
233
|
+
}
|
234
|
+
return {
|
235
|
+
isValid: true
|
236
|
+
};
|
237
|
+
};
|
238
|
+
var validationVariants = {
|
239
|
+
email: validateEmail,
|
240
|
+
password: validatePassword
|
241
|
+
};
|
242
|
+
var useValidation = exports.useValidation = function useValidation(_ref) {
|
243
|
+
var validationType = _ref.validationType,
|
244
|
+
options = _ref.options,
|
245
|
+
onValidate = _ref.onValidate;
|
246
|
+
var handleValidationBlur = function handleValidationBlur(event) {
|
247
|
+
if (!validationType) {
|
248
|
+
return;
|
249
|
+
}
|
250
|
+
var validationResult = validationVariants[validationType](event.target.value, options);
|
251
|
+
onValidate === null || onValidate === void 0 || onValidate(validationResult);
|
252
|
+
};
|
253
|
+
var handleValidationKeyDown = function handleValidationKeyDown(event) {
|
254
|
+
if (!validationType) {
|
255
|
+
return;
|
256
|
+
}
|
257
|
+
if (event.keyCode === _utils.constants.keyCodes.Enter) {
|
258
|
+
event.preventDefault();
|
259
|
+
var _ref2 = event.target,
|
260
|
+
value = _ref2.value;
|
261
|
+
var validationResult = validationVariants[validationType](value, options);
|
262
|
+
onValidate === null || onValidate === void 0 || onValidate(validationResult);
|
263
|
+
}
|
264
|
+
};
|
265
|
+
(0, _react.useEffect)(function () {
|
266
|
+
validateLenghtOptions(options);
|
267
|
+
if (validationType === 'email') {
|
268
|
+
var _whitelistDomains, _blacklistDomains;
|
269
|
+
validateEmailDomainsLists(options === null || options === void 0 || (_whitelistDomains = options.whitelistDomains) === null || _whitelistDomains === void 0 ? void 0 : _whitelistDomains.value, (_blacklistDomains = options.blacklistDomains) === null || _blacklistDomains === void 0 ? void 0 : _blacklistDomains.value);
|
270
|
+
}
|
271
|
+
}, []);
|
272
|
+
return {
|
273
|
+
handleValidationBlur: handleValidationBlur,
|
274
|
+
handleValidationKeyDown: handleValidationKeyDown
|
275
|
+
};
|
276
|
+
};
|