25 lines
998 B
TypeScript
25 lines
998 B
TypeScript
import { cn } from './utils';
|
|
import type { VariantProps } from 'class-variance-authority';
|
|
import { cva } from 'class-variance-authority';
|
|
import { forwardRef } from 'react';
|
|
|
|
const variants = cva(
|
|
'w-4 h-4 focus:ring-transparent rounded-sm hover:border-primary-500 disabled:hover:border-gray-300 border-gray-300 text-sm text-primary outline-none transition-all ease-linear hover:transition-all focus:transition-all disabled:cursor-not-allowed disabled:text-opacity-30'
|
|
);
|
|
|
|
export type CheckboxProps = React.InputHTMLAttributes<HTMLInputElement> &
|
|
VariantProps<typeof variants>;
|
|
|
|
export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
|
|
({ className, title, ...props }, ref) => (
|
|
<div className="flex items-center">
|
|
<input ref={ref} type="checkbox" className={cn(variants({ className }))} {...props} />
|
|
{title && (
|
|
<label htmlFor={props.id} className="ml-2 text-sm font-normal text-gray-900">
|
|
{title}
|
|
</label>
|
|
)}
|
|
</div>
|
|
)
|
|
);
|