1import * as React from "react"
2import * as TogglePrimitive from "@radix-ui/react-toggle"
3import { cva, type VariantProps } from "class-variance-authority"
4
5import { cn } from "@marzneshin/utils"
6
7const toggleVariants = cva(
8 "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground",
9 {
10 variants: {
11 variant: {
12 default: "bg-transparent",
13 outline:
14 "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground",
15 },
16 size: {
17 default: "h-10 px-3",
18 sm: "h-9 px-2.5",
19 lg: "h-11 px-5",
20 },
21 },
22 defaultVariants: {
23 variant: "default",
24 size: "default",
25 },
26 }
27)
28
29const Toggle = React.forwardRef<
30 React.ElementRef<typeof TogglePrimitive.Root>,
31 React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> &
32 VariantProps<typeof toggleVariants>
33>(({ className, variant, size, ...props }, ref) => (
34 <TogglePrimitive.Root
35 ref={ref}
36 className={cn(toggleVariants({ variant, size, className }))}
37 {...props}
38 />
39))
40
41Toggle.displayName = TogglePrimitive.Root.displayName
42
43export { Toggle, toggleVariants }