Checkbox, Radio e Switch

Formulário

Marcar, escolher uma opção ou ligar e desligar. Usam o input nativo por baixo, então teclado e formulário funcionam sem nada a mais.

Substitui no Brain:CaixaChaveui switchpartners Checkbox

Checkbox

import { Checkbox } from "@paytime/ui";

export default function Example() {
  return (
    <div className="flex flex-col gap-3">
      <Checkbox label="Aceito os termos" />
      <Checkbox label="Receber resumo semanal" defaultChecked />
      <Checkbox label="Selecionar todos" indeterminate />
      <Checkbox label="Indisponível" disabled />
    </div>
  );
}

Radio e Switch

import { Radio, Switch } from "@paytime/ui";

export default function Example() {
  return (
    <div className="flex flex-col gap-3">
      <div className="flex gap-6">
        <Radio name="cobranca" label="Mensal" defaultChecked />
        <Radio name="cobranca" label="Anual" />
      </div>
      <Switch label="Notificações por e-mail" defaultChecked />
      <Switch label="Modo de teste" disabled />
    </div>
  );
}