interface TextInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
  // styled input
}

export function TextInput({ className = "", ...props }: TextInputProps) {
  return (
    <input
      className={`w-full px-2 py-1 text-sm bg-surface text-ink border border-line-strong rounded-md placeholder:text-ink-subtle outline-none focus:border-teal-500 focus:ring-1 focus:ring-teal-100 transition-colors duration-150 ${className}`}
      {...props}
    />
  );
}