// <TextField> — a labelled single-line text input, the shared control
// every form (`CreateAgentForm` today) reaches for instead
// of hand-rolling its own label/input pair. No textarea/multi-line
// mode — promote that the day a real caller needs one, same "don't
// build ahead of a caller" rule the rest of `ui/` follows.
import { FormField } from '../form-field/FormField.js';

export function TextField({
  id,
  label,
  value,
  onInput,
  type = 'text',
  pattern,
  title,
  required,
  placeholder,
}: {
  id: string;
  label: string;
  value: string;
  onInput: (value: string) => void;
  type?: string;
  pattern?: string;
  title?: string;
  required?: boolean;
  placeholder?: string;
}) {
  return (
    <FormField label={label} htmlFor={id}>
      <input
        id={id}
        class="ui-form-control"
        type={type}
        value={value}
        pattern={pattern}
        title={title}
        required={required}
        placeholder={placeholder}
        onInput={(e) => onInput((e.target as HTMLInputElement).value)}
      />
    </FormField>
  );
}