Switch

A control that allows the user to toggle a setting on or off.

Installation

bun add elia

@import "tailwindcss";
@import "@aile.sh/elia/styles/elia.css";
@source "../node_modules/@aile.sh/elia";

Usage

import { useState } from "react";
import { Switch } from "@aile.sh/elia";

export function Example() {
  const [streaming, setStreaming] = useState(true);
  const [caching, setCaching] = useState(false);

  return (
    <div className="flex max-w-xs flex-col gap-3">
      <Switch checked={streaming} onChange={setStreaming} label="Stream responses" />
      <Switch checked={caching} onChange={setCaching} label="Prompt caching" />
      <Switch checked={false} onChange={() => {}} label="Spend alerts (plan required)" disabled />
    </div>
  );
}

— elia design system · MIT · base · https://github.com/aile-sh/elia