import { fontSizes } from '../global/typography';
import { systemPalette } from '../global/colors';

interface IconFontSizes {
  inherit: string;
  large: string;
  medium: string;
  small: string;
  xlarge: string;
  xsmall: string;
}

interface IconColors {
  danger: string;
  disabledText: string;
  error: string;
  info: string;
  inherit: string;
  primary: string;
  subduedText: string;
  success: string;
  text: string;
  warning: string;
}

const iconFontSizes: IconFontSizes = {
  inherit: 'inherit',
  xsmall: `${fontSizes.small}px`,
  small: `${fontSizes.medium}px`,
  medium: `${fontSizes.large}px`,
  large: `${fontSizes.xlarge}px`,
  xlarge: `${fontSizes.xxlarge}px`,
};

const iconSizes = iconFontSizes;

const iconColors: IconColors = {
  info: systemPalette.info,
  inherit: 'inherit',
  text: systemPalette.text,
  subduedText: systemPalette.subduedText,
  disabledText: systemPalette.disabledText,
  primary: systemPalette.primary,
  danger: systemPalette.danger,
  warning: systemPalette.warning,
  success: systemPalette.success,
  error: systemPalette.error,
};

export { iconSizes, iconFontSizes, iconColors };