---
/**
 * InputField — a question above one underlined answer line.
 * multiline: renders a textarea that starts one line tall and grows.
 * state: 'focus' — forces the focus underline for documentation.
 * Other attributes (name, type, value, required, aria-label) go to the control.
 */
interface Props { label: string; multiline?: boolean; state?: 'focus'; labelClass?: string; [attr: string]: any }
const { label, multiline = false, state, labelClass, type = 'text', ...rest } = Astro.props;
const cls = state ? `is-${state}` : undefined;
---
<label class="cp-field"><span class:list={['cp-label', labelClass]}>{label}</span>{multiline
  ? <textarea rows="1" class={cls} {...rest}></textarea>
  : <input type={type} class={cls} {...rest}>}</label>