Radio

<div className="flex gap-xs items-start">
  <HvRadio label="Radio" />
  <HvRadio required label="Required" />
  <HvRadio defaultChecked label="Checked" />
  <HvRadio semantic label="Semantic" />
  <HvRadio status="invalid" statusMessage="This is invalid!" label="Error" />
  <HvRadio aria-label="No visible label" />
</div>

import { useState } from "react";


export default function Demo() {
  const [isChecked, setIsChecked] = useState(false);


  return (
    <>
      <HvRadio checked={isChecked} label="Radio 1" />
      <HvRadio
        checked={isChecked}
        onChange={(_, checked) => setIsChecked(checked)}
        label="Radio 2"
      />
    </>
  );
}