[PS-227] Feature: Create Select Component

[diogocaxiado]

Componetização do Select

• Criação da estrutura de componentes do Select:

  • O componente é dividido por alguns componentes internos, gerando melhor controle e entendimento do código.

• Propriedades:

  • O componente contêm as propriedades nativas da biblioteca shadcn do componente Select - Link.

  • Prop personalizada error que alterna o comportamento do componente para o estado de erro.

    • Ilustração da propriedade error ativa:

    

• Passo a passo de uso:

    <Select>
        <SelectTrigger>
          <SelectValue placeholder="Porte do seu pet" />
        </SelectTrigger>
        <SelectContent>
          <SelectGroup>
            <ScrollArea className='h-[150px] mr-1'>
              <SelectItem value="mini">Mini (Até 6Kgs)</SelectItem>
              <SelectItem value="cst">Pequeno (6 à 14Kgs)</SelectItem>
              <SelectItem value="mst">Médio (15 à 24Kgs)</SelectItem>
              <SelectItem value="pst">Grande (25 à 45Kgs)</SelectItem>
              <SelectItem value="akst">Gigante (Acima de 45Kgs)</SelectItem>
            </ScrollArea>
          </SelectGroup>
        </SelectContent>
      </Select>