import { type ComponentProps } from 'react'

import { Switch as RadixSwitch } from 'radix-ui'

import { type RootStylesProps, rootStyles, thumbStyles } from './Switch.styles'

type SwitchProps = ComponentProps<typeof RadixSwitch.Root> & RootStylesProps

function Switch({ color, className, ...props }: SwitchProps) {
	return (
		<RadixSwitch.Root
			className={rootStyles({ color, className })}
			{...props}
		>
			<RadixSwitch.Thumb className={thumbStyles} />
		</RadixSwitch.Root>
	)
}

export { Switch }
