import {
  Control,
  DropdownIndicator,
  IndicatorSeparator,
  Input,
  LoadingIndicator,
  LoadingMessage,
  MenuList,
  Option,
  ClearIndicator,
  MultiValueLabel,
  MultiValueRemove,
  NoOptionsMessage,
  SelectContainer,
  SingleValue,
  ValueContainer,
} from "../components";
import type { TSelectCustomComponents } from "../config/types";

/**
 * Builds the `components` object for `react‑select`.
 * Merges unknown custom components provided by the user.
 * @returns {TSelectCustomComponents}
 */
export const getComponents: <IsMulti extends boolean>(props: TSelectCustomComponents<IsMulti>) => TSelectCustomComponents<IsMulti> = (
  customComponents = {}
) => {
  return {
    SelectContainer: (props: Parameters<typeof SelectContainer>[0]) => <SelectContainer {...props} />,
    LoadingIndicator,
    MenuList,
    SingleValue: (props: Parameters<typeof SingleValue>[0]) => <SingleValue {...props} />,
    DropdownIndicator: (props: Parameters<typeof DropdownIndicator>[0]) => <DropdownIndicator {...props} />,
    IndicatorSeparator,
    NoOptionsMessage: (props: Parameters<typeof NoOptionsMessage>[0]) => <NoOptionsMessage {...props} />,
    Input: (props: Parameters<typeof Input>[0]) => <Input {...props} />,
    Control: (props: Parameters<typeof Control>[0]) => <Control {...props} />,
    ClearIndicator: (props: Parameters<typeof ClearIndicator>[0]) => <ClearIndicator {...props} />,
    Option: (props: Parameters<typeof Option>[0]) => <Option {...props} />,
    MultiValueRemove: (props: Parameters<typeof MultiValueRemove>[0]) => <MultiValueRemove {...props} />,
    MultiValueLabel: (props: Parameters<typeof MultiValueLabel>[0]) => <MultiValueLabel {...props} />,
    ValueContainer: (props: Parameters<typeof ValueContainer>[0]) => <ValueContainer {...props} />,
    LoadingMessage,
    ...customComponents,
  };
};