import { cn } from '@/lib/cn';

/** Integer input that never emits NaN — coerces blanks/garbage to a fallback. */
export function NumberField({
  value,
  onChange,
  min,
  max,
  className,
  'aria-label': ariaLabel,
}: {
  value: number;
  onChange: (n: number) => void;
  min?: number;
  max?: number;
  className?: string;
  'aria-label'?: string;
}) {
  return (
    <input
      type="number"
      inputMode="numeric"
      aria-label={ariaLabel}
      value={Number.isFinite(value) ? value : 0}
      min={min}
      max={max}
      onChange={(e) => {
        const raw = Number(e.target.value);
        let n = Number.isFinite(raw) ? Math.trunc(raw) : 0;
        if (min !== undefined) n = Math.max(min, n);
        if (max !== undefined) n = Math.min(max, n);
        onChange(n);
      }}
      className={cn(
        'w-full rounded-md border border-line bg-surface px-2 py-1.5 text-center text-sm text-ink',
        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/60',
        className,
      )}
    />
  );
}