<a id="validator"></a>

## Validator  
**Category**: Data Input
Form validation states with visual feedback
### Examples

#### Email Validation  
```python
Input(type='email', required=True, placeholder='mail@site.com', cls='input validator')
```

#### Validation with hint text  
```python
Input(type='email', required=True, placeholder='mail@site.com', cls='input validator'),
Div('Enter valid email address', cls='validator-hint')
```

#### Password Requirements  
```python
Input(type='password', required=True, placeholder='Password', minlength='8', pattern='(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}', title='Must be more than 8 characters, including number, lowercase letter, uppercase letter', cls='input validator'),
P(
    'Must be more than 8 characters, including',
    Br(),
    'At least one number',
    Br(),
    'At least one lowercase letter',
    Br(),
    'At least one uppercase letter',
    cls='validator-hint hidden'
)
```

#### URL input Requirements  
```python
Input(type='url', required=True, placeholder='https://', value='https://', pattern='^(https?://)?([a-zA-Z0-9]([a-zA-Z0-9-].*[a-zA-Z0-9])?.)+[a-zA-Z].*$', title='Must be valid URL', cls='input validator'),
P('Must be valid URL', cls='validator-hint')
```

#### Username Requirements  
```python
Input(type='input', required=True, placeholder='Username', pattern='[A-Za-z][A-Za-z0-9\-]*', minlength='3', maxlength='30', title='Only letters, numbers or dash', cls='input validator'),
P(
    'Must be 3 to 30 characters',
    Br(),
    'containing only letters, numbers or dash',
    cls='validator-hint'
)
```

#### Date input Requirements  
```python
Input(type='date', required=True, placeholder='Pick a date in 2025', min='2025-01-01', max='2025-12-31', title='Must be valid URL', cls='input validator'),
P('Must be 2025', cls='validator-hint')
```

#### Phone Number Requirements  
```python
Input(type='tel', required=True, placeholder='Phone', pattern='[0-9]*', minlength='10', maxlength='10', title='Must be 10 digits', cls='input validator tabular-nums'),
P('Must be 10 digits', cls='validator-hint')
```

#### Number input Requirements  
```python
Input(type='number', required=True, placeholder='Type a number between 1 to 10', min='1', max='10', title='Must be between be 1 to 10', cls='input validator'),
P('Must be between be 1 to 10', cls='validator-hint')
```

#### Checkbox Requirements  
```python
Input(type='checkbox', required=True, title='Required', cls='checkbox validator'),
P('Required', cls='validator-hint hidden')
```

#### Toggle Requirements  
```python
Input(type='checkbox', required=True, title='Required', cls='toggle validator'),
P('Required', cls='validator-hint hidden')
```

#### Select Requirements  
```python
Form(
    Select(
        Option('Choose:', disabled=True, selected=True, value=''),
        Option('Tabs'),
        Option('Spaces'),
        required=True,
        cls='select validator'
    ),
    P('Required', cls='validator-hint'),
    Button('Submit form', type='submit', cls='btn')
)
```

