Radio

Preview

Switch the framework picker (top-right of the panel) to render the same demo live in React, Vue, or Angular — same class names, ARIA, and visual output across all three.

Installation

Sisyphos UI ships unified packages for React, Vue, and Angular. Pick the one that matches your stack — every framework exports the same component classes, ARIA semantics, and CSS tokens.

$ pnpm add @sisyphos-ui/react

Usage

import { useState } from "react";
import { RadioGroup, Radio } from "@sisyphos-ui/react";

export const Plan = () => {
  const [plan, setPlan] = useState<string | number>("pro");
  return (
    <RadioGroup label="Plan" value={plan} onChange={setPlan} variant="card">
      <Radio value="free" label="Free" />
      <Radio value="pro" label="Pro" />
    </RadioGroup>
  );
};

API

Props table is being written. See the package README for the complete API surface.

The full API including refs, ARIA attributes, and HTML passthroughs lives in the package README on npm.