import * as React from "react";

export interface InputProps {
  label?: string;
  value?: string;
  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
  placeholder?: string;
  /** 16px stroke icon shown inside, left of the field (e.g. search). */
  leadingIcon?: React.ReactNode;
  /** Element pinned to the right inside the field (clear button, unit). */
  trailing?: React.ReactNode;
  /** Error message — turns the border red and shows text below. */
  error?: string | null;
  disabled?: boolean;
  size?: "sm" | "md";
  type?: string;
  fullWidth?: boolean;
  style?: React.CSSProperties;
}

/**
 * Text field on a sunken well with focus ring and optional icon/error.
 */
export function Input(props: InputProps): JSX.Element;