import classNames from 'classnames';

import type { SearchInputOwnProps } from './types';

const DEFAULT_WIDTH = 'md';
const DEFAULT_ICON = true;

export function getSearchInputProps<P extends SearchInputOwnProps>({
  className,
  error,
  warning,
  icon = DEFAULT_ICON,
  width = DEFAULT_WIDTH,
  label,
  onChange,
  onBlur,
  onFocus,
  ...rest
}: P) {
  return {
    ...rest,
    onChange: (event: React.ChangeEvent<HTMLInputElement>) => onChange?.(event.target.value, event),
    onBlur: (event: React.FocusEvent<HTMLInputElement>) => onBlur?.(event.target.value, event),
    onFocus: (event: React.FocusEvent<HTMLInputElement>) => onFocus?.(event.target.value, event),
    'aria-label': label ?? rest['aria-label'],
    className: classNames(className, 'searchField', width, {
      'error-field': error,
      'warning-field': warning,
      'searchField--icon': icon,
    }),
    type: 'search',
  };
}