// @flow
import { type Element } from 'react';
import type { TypographyProps } from '../../../mixins/typography';
import { type TranslatedContent } from '../../../types';

type SizeKey = 's1' | 's2';

export type SizeProps = {|
  sizing?: SizeKey,
|};

export type SelectProps = {|
  ...SizeProps,
  ...TypographyProps,
  children: Array<Element<*>>,
  disabled?: boolean,
  className?: string,
  error?: boolean,
  large?: boolean,
  onBlur?: (SyntheticFocusEvent<HTMLInputElement>) => void,
  onChange: (string | void) => void,
  onFocus?: (SyntheticFocusEvent<HTMLInputElement>) => void,
  placeholder?: string,
  /** value is required as undefined, which will show the placeholder for you if it changes from val -> undefined */
  value: string | number | void,
  label: TranslatedContent,
  hideLabel?: boolean,
  id?: string,
|};
