chore: fix aria label warnings

app/components/Input.tsx

@@ -3,12 +3,14 @@ import { type AriaTextFieldProps, useId, useTextField } from 'react-aria';
 import cn from '~/utils/cn';
 
 export interface InputProps extends AriaTextFieldProps<HTMLInputElement> {
+	label: string;
+	labelHidden?: boolean;
 	isRequired?: boolean;
 	className?: string;
 }
 
 export default function Input(props: InputProps) {
-	const { label, className } = props;
+	const { label, labelHidden, className } = props;
 	const ref = useRef<HTMLInputElement | null>(null);
 	const id = useId(props.id);
 
@@ -19,16 +21,24 @@ export default function Input(props: InputProps) {
 		errorMessageProps,
 		isInvalid,
 		validationErrors,
-	} = useTextField(props, ref);
+	} = useTextField(
+		{
+			...props,
+			label,
+			'aria-label': label,
+		},
+		ref,
+	);
 
 	return (
-		<div className="flex flex-col">
+		<div className="flex flex-col w-full" aria-label={label}>
 			<label
 				{...labelProps}
 				htmlFor={id}
 				className={cn(
 					'text-xs font-medium px-3 mb-0.5',
 					'text-headplane-700 dark:text-headplane-100',
+					labelHidden && 'sr-only',
 				)}
 			>
 				{label}
@@ -37,7 +47,6 @@ export default function Input(props: InputProps) {
 				{...inputProps}
 				required={props.isRequired}
 				ref={ref}
-				id={id}
 				className={cn(
 					'rounded-xl px-3 py-2',
 					'focus:outline-none focus:ring',