Toggle

import { Toggle } from "@craftdotui/baseui/components/toggle";

<Toggle>Toggle me</Toggle>

<Toggle>Bold</Toggle>

import { Bold } from "lucide-react";

<Toggle size="icon">
  <Bold />
</Toggle>

<Toggle variant="default">Default</Toggle>
<Toggle variant="outline">Outline</Toggle>

<Toggle size="sm">Small</Toggle>
<Toggle size="md">Medium</Toggle>
<Toggle size="lg">Large</Toggle>

const [pressed, setPressed] = useState(false);

<Toggle pressed={pressed} onPressedChange={setPressed}>
  {pressed ? 'On' : 'Off'}
</Toggle>

import { Bold, Italic, Underline } from "lucide-react";

<div className="flex gap-1">
  <Toggle size="icon"><Bold /></Toggle>
  <Toggle size="icon"><Italic /></Toggle>
  <Toggle size="icon"><Underline /></Toggle>
</div>