first commit

src/components/forms/FormCheckbox.tsx

@@ -0,0 +1,30 @@
+import React, { forwardRef } from "react";
+
+interface FormCheckboxProps
+  extends React.InputHTMLAttributes<HTMLInputElement> {
+  label: string;
+}
+
+export const FormCheckbox = forwardRef<HTMLInputElement, FormCheckboxProps>(
+  ({ label, ...props }, ref) => (
+    <label className="flex items-center space-x-3 cursor-pointer group">
+      <input
+        type="checkbox"
+        ref={ref}
+        className="
+          w-5 h-5 rounded
+          border-gray-300 text-blue-600
+          focus:ring-2 focus:ring-blue-500
+          transition duration-150 ease-in-out
+          cursor-pointer
+        "
+        {...props}
+      />
+      <span className="text-sm text-gray-700 group-hover:text-gray-900">
+        {label}
+      </span>
+    </label>
+  ),
+);
+
+FormCheckbox.displayName = "FormCheckbox";