ToggleGroup

Grupo de toggles, single o multiple.

Selección única

Vista previa

<ToggleGroup
  type="single"
  defaultValue="centro"
  items={[
    { value: "izq", label: "Izq." },
    { value: "centro", label: "Centro" },
    { value: "der", label: "Der." },
  ]}
/>

Selección múltiple (outline)

Vista previa

<ToggleGroup
  type="multiple"
  variant="outline"
  defaultValue={["b"]}
  items={[{ value: "b", label: "B" }, …]}
/>

Comparación de temas

El mismo componente bajo distintos modos y marcas. No cambia el componente — solo los tokens (CSS variables) del contenedor.

Legacy · claro

Editorial · claro

Technical · oscuro

Warm · claro

Playful · claro