Date Picker trata-se de um calendário que facilita o preenchimento de um campo de data. O usuário pode digitar diretamente a data no input ou selecionar a data desejada no pequeno calendário disponível ao clicar no ícone.

b.1) Dimensões:          

            Altura do calenário: 113px

            Altura do header: 18px

            Altura da faixa de semanas: 14px

           Altura do espaço dos dias: 81px

            Largura: 154px

 b.2) Cores:
           (Consulte o item 2.2 para mais detalhes sobre cores)

            Header: 1

            Semanas: 6

            Espaço dos dias: 7

            Calendário dia atual: 3

            Contorno: 6, 1px

 b.3) Textos:

            Texto calendário mês: OSr/11 (8)

            Texto calendário semanas: OSr/9 (4)

            Texto calendário dias: OSr/10 (4)

O Date Picker é um componente que auxilia o usuário a preencher campos de datas. Estes campos podem ser preenchidos diretamente com o teclado ou selecionado por meio de um calendário suspenso que fica disponível ao clicar no ícone de calendário. Um vez selecionada a data, o calendário fecha automaticamente.

Há um link "Data atual", que preenche automaticamente com a data corrente.

Os campos de input devem vir preenchidos com a base da data ( ___ / ___ / ___).

Quando houver data inicial e final, esta jamais poderá ser inferior à primeira. Neste caso, o usuário deve ser informado com uma mensagem de erro, assim como nos casos de formato inválido de data (consulte o tópico de erros para mais detalhes).