Toggle

import Toggle from "@/components/ui/Toggle";

export default function Page() {
  return (
    <Toggle>B</Toggle>
  )
}

import Toggle from "@/components/ui/Toggle";
import { IconItalic } from '@tabler/icons-react';
export default function Page() {
  return (
    <Toggle>
      <IconItalic size={18} />
      Italic
    </Toggle>
  )
}

import Toggle from "@/components/ui/Toggle";

export default function Page() {
  return (
    <div className="flex items-center gap-4">
      <Toggle size="sm">B</Toggle>
      <Toggle size="md">B</Toggle>
      <Toggle size="lg">B</Toggle>
    </div>
  )
}

import Toggle from "@/components/ui/Toggle";

export default function Page() {
  return (
    <div className="flex items-center gap-4">
      <Toggle variant="light">light</Toggle>
      <Toggle variant="bordered">bordered</Toggle>
    </div>
  )
}

import Toggle from "@/components/ui/Toggle";

export default function Page() {
  return (
    <Toggle disabled>disabled</Toggle>
  )
}