import * as Color_ from 'color';
const Color = (Color_ as any).default || Color_;
const mixer =
  (mixColor = '#ffffff') =>
  (color = '#ffffff', percentage = 1) =>
    Color(color).mix(Color(mixColor), percentage).hex();

const lighten = mixer('white');
const darken = mixer('black');

/*   Base Colors   */
export const white = '#ffffff';
export const silver = '#f9fafb';
export const nickel = '#eef0f2';

export const brand = '#0057B8';
export const gray = '#444444';
export const pink = '#fc6ab8';
export const purple = '#8826ff';
export const blue = '#0058ff';
export const teal = '#23D6BE';
export const green = '#1da379';
export const yellow = '#f0b323';
export const red = '#f9423a';

/* Brand Colors */
export const brandLight15 = lighten(brand, 0.15);
export const brandLight30 = lighten(brand, 0.3);
export const brandLight40 = lighten(brand, 0.4);
export const brandLight50 = lighten(brand, 0.5);
export const brandLight60 = lighten(brand, 0.6);
export const brandLight70 = lighten(brand, 0.7);
export const brandLight80 = lighten(brand, 0.8);
export const brandLight90 = lighten(brand, 0.9);
export const brandLight95 = lighten(brand, 0.95);
export const brandLight99 = lighten(brand, 0.99);
export const brandDark15 = darken(brand, 0.15);
export const brandDark40 = darken(brand, 0.4);
export const brandDark55 = darken(brand, 0.55);

/* Gray Colors */
export const grayLight15 = lighten(gray, 0.15);
export const grayLight30 = lighten(gray, 0.3);
export const grayLight40 = lighten(gray, 0.4);
export const grayLight50 = lighten(gray, 0.5);
export const grayLight60 = lighten(gray, 0.6);
export const grayLight70 = lighten(gray, 0.7);
export const grayLight80 = lighten(gray, 0.8);
export const grayLight90 = lighten(gray, 0.9);
export const grayLight95 = lighten(gray, 0.95);
export const grayLight99 = lighten(gray, 0.99);
export const grayDark15 = darken(gray, 0.15);
export const grayDark40 = darken(gray, 0.4);
export const grayDark55 = darken(gray, 0.55);

/* Pink Colors */
export const pinkLight15 = lighten(pink, 0.15);
export const pinkLight30 = lighten(pink, 0.3);
export const pinkLight40 = lighten(pink, 0.4);
export const pinkLight50 = lighten(pink, 0.5);
export const pinkLight60 = lighten(pink, 0.6);
export const pinkLight70 = lighten(pink, 0.7);
export const pinkLight80 = lighten(pink, 0.8);
export const pinkLight90 = lighten(pink, 0.9);
export const pinkLight95 = lighten(pink, 0.95);
export const pinkLight99 = lighten(pink, 0.99);
export const pinkDark15 = darken(pink, 0.15);
export const pinkDark40 = darken(pink, 0.4);
export const pinkDark55 = darken(pink, 0.55);

/* Purple Colors */
export const purpleLight15 = lighten(purple, 0.15);
export const purpleLight30 = lighten(purple, 0.3);
export const purpleLight40 = lighten(purple, 0.4);
export const purpleLight50 = lighten(purple, 0.5);
export const purpleLight60 = lighten(purple, 0.6);
export const purpleLight70 = lighten(purple, 0.7);
export const purpleLight80 = lighten(purple, 0.8);
export const purpleLight90 = lighten(purple, 0.9);
export const purpleLight95 = lighten(purple, 0.95);
export const purpleLight99 = lighten(purple, 0.99);
export const purpleDark15 = darken(purple, 0.15);
export const purpleDark40 = darken(purple, 0.4);
export const purpleDark55 = darken(purple, 0.55);

/* Blue Colors */
export const blueLight15 = lighten(blue, 0.15);
export const blueLight30 = lighten(blue, 0.3);
export const blueLight40 = lighten(blue, 0.4);
export const blueLight50 = lighten(blue, 0.5);
export const blueLight60 = lighten(blue, 0.6);
export const blueLight70 = lighten(blue, 0.7);
export const blueLight80 = lighten(blue, 0.8);
export const blueLight90 = lighten(blue, 0.9);
export const blueLight95 = lighten(blue, 0.95);
export const blueLight99 = lighten(blue, 0.99);
export const blueDark15 = darken(blue, 0.15);
export const blueDark40 = darken(blue, 0.4);
export const blueDark55 = darken(blue, 0.55);

/* Green Colors */
export const greenLight15 = lighten(green, 0.15);
export const greenLight30 = lighten(green, 0.3);
export const greenLight40 = lighten(green, 0.4);
export const greenLight50 = lighten(green, 0.5);
export const greenLight60 = lighten(green, 0.6);
export const greenLight70 = lighten(green, 0.7);
export const greenLight80 = lighten(green, 0.8);
export const greenLight90 = lighten(green, 0.9);
export const greenLight95 = lighten(green, 0.95);
export const greenLight99 = lighten(green, 0.99);
export const greenDark15 = darken(green, 0.15);
export const greenDark40 = darken(green, 0.4);
export const greenDark55 = darken(green, 0.55);

/* Teal Colors */
export const tealLight15 = lighten(teal, 0.15);
export const tealLight30 = lighten(teal, 0.3);
export const tealLight40 = lighten(teal, 0.4);
export const tealLight50 = lighten(teal, 0.5);
export const tealLight60 = lighten(teal, 0.6);
export const tealLight70 = lighten(teal, 0.7);
export const tealLight80 = lighten(teal, 0.8);
export const tealLight90 = lighten(teal, 0.9);
export const tealLight95 = lighten(teal, 0.95);
export const tealLight99 = lighten(teal, 0.99);
export const tealDark15 = darken(teal, 0.15);
export const tealDark40 = darken(teal, 0.4);
export const tealDark55 = darken(teal, 0.55);

/* Yellow Colors */
export const yellowLight15 = lighten(yellow, 0.15);
export const yellowLight30 = lighten(yellow, 0.3);
export const yellowLight40 = lighten(yellow, 0.4);
export const yellowLight50 = lighten(yellow, 0.5);
export const yellowLight60 = lighten(yellow, 0.6);
export const yellowLight70 = lighten(yellow, 0.7);
export const yellowLight80 = lighten(yellow, 0.8);
export const yellowLight90 = lighten(yellow, 0.9);
export const yellowLight95 = lighten(yellow, 0.95);
export const yellowLight99 = lighten(yellow, 0.99);
export const yellowDark15 = darken(yellow, 0.15);
export const yellowDark40 = darken(yellow, 0.4);
export const yellowDark55 = darken(yellow, 0.55);

/* Red Colors */
export const redLight15 = lighten(red, 0.15);
export const redLight30 = lighten(red, 0.3);
export const redLight40 = lighten(red, 0.4);
export const redLight50 = lighten(red, 0.5);
export const redLight60 = lighten(red, 0.6);
export const redLight70 = lighten(red, 0.7);
export const redLight80 = lighten(red, 0.8);
export const redLight90 = lighten(red, 0.9);
export const redLight95 = lighten(red, 0.95);
export const redLight99 = lighten(red, 0.99);
export const redDark15 = darken(red, 0.15);
export const redDark40 = darken(red, 0.4);
export const redDark55 = darken(red, 0.55);

/* White transparents */
export const whiteTransparent15 = 'rgba(255, 255, 255, 0.85)';
export const whiteTransparent30 = 'rgba(255, 255, 255, 0.7)';
export const whiteTransparent40 = 'rgba(255, 255, 255, 0.6)';
export const whiteTransparent50 = 'rgba(255, 255, 255, 0.5)';
export const whiteTransparent60 = 'rgba(255, 255, 255, 0.4)';
export const whiteTransparent70 = 'rgba(255, 255, 255, 0.3)';
export const whiteTransparent80 = 'rgba(255, 255, 255, 0.2)';
export const whiteTransparent90 = 'rgba(255, 255, 255, 0.1)';
export const whiteTransparent95 = 'rgba(255, 255, 255, 0.05)';

/* Gray transparents */
export const grayTransparent50 = 'rgba(68, 68, 68, 0.5)';

/*  Alias Tokens  */
export const uiBackground = white;
export const uiBackgroundAlt = silver;
export const uiBackgroundModal = grayTransparent50;
export const shadow = grayDark55;
export const shadowRGB = Color(shadow).rgb().array().join(', ');

export const textPrimary = grayDark55;
export const textSecondary = grayLight15;
export const textTertiary = grayLight40;
export const textPrimaryInverse = white;
export const textSecondaryInverse = whiteTransparent30;
export const textTertiaryInverse = whiteTransparent50;

export const textLinkDisabled = grayLight50;
export const textLinkEnabled = blue;
export const textLinkHover = blue;
export const textLinkFocus = blue;
export const textLinkActive = blueDark40;
export const textLinkVisited = blue;

export const interactive = blue;
export const info = blueLight30;
export const danger = red;
export const success = green;
export const warning = yellow;
export const dataNegative = redLight15;
export const dataPositive = greenLight15;

export const inputLabel = grayLight30;
export const inputCaret = grayLight40;
export const inputValuePlaceholder = grayLight40;
export const inputLabelDisabled = grayLight40;
export const valueDisabled = grayLight50;
export const inputBackgroundDisabled = silver;
export const inputFocus = gray;
export const inputInvalid = redDark15;
export const inputBorder = grayLight90;

export const tooltipBackground = grayLight15;

export const buttonBackgroundTextHover = blueLight95;
export const buttonBackgroundTextFocus = blueLight90;
export const buttonBackgroundTextActive = blueLight80;
export const buttonLabelTextDisabled = grayLight50;
export const buttonLabelTextEnabled = blue;
export const buttonLabelTextHover = blue;
export const buttonLabelTextFocus = blue;
export const buttonLabelTextActive = blue;
export const buttonBackgroundOutlinedDisabled = white;
export const buttonBackgroundOutlinedEnabled = white;
export const buttonBackgroundOutlinedHover = blueLight95;
export const buttonBackgroundOutlinedFocus = blueLight90;
export const buttonBackgroundOutlinedActive = blueLight80;
export const buttonBorderOutlinedDisabled = grayLight80;
export const buttonBorderOutlinedEnabled = blue;
export const buttonBorderOutlinedHover = blue;
export const buttonBorderOutlinedFocus = blue;
export const buttonBorderOutlinedActive = blue;
export const buttonLabelOutlinedDisabled = grayLight50;
export const buttonLabelOutlinedEnabled = blue;
export const buttonLabelOutlinedHover = blue;
export const buttonLabelOutlinedFocus = blue;
export const buttonLabelOutlinedActive = blue;
export const buttonBackgroundDisabled = grayLight95;
export const buttonBackgroundEnabled = blueDark15;
export const buttonBackgroundHover = blue;
export const buttonBackgroundFocus = blueLight15;
export const buttonBackgroundActive = blueLight30;
export const buttonBorderDisabled = grayLight80;
export const buttonBorderEnabled = blueDark15;
export const buttonBorderHover = blue;
export const buttonBorderFocus = blueLight15;
export const buttonBorderActive = blueLight30;
export const buttonLabelDisabled = grayLight50;
export const buttonLabelEnabled = white;
export const buttonLabelHover = white;
export const buttonLabelFocus = white;
export const buttonLabelActive = white;
export const buttonBackgroundDangerDisabled = redLight95;
export const buttonBackgroundDangerEnabled = redDark15;
export const buttonBackgroundDangerHover = red;
export const buttonBackgroundDangerFocus = redLight15;
export const buttonBackgroundDangerActive = redLight30;
export const buttonBorderDangerDisabled = redLight90;
export const buttonBorderDangerEnabled = redDark15;
export const buttonBorderDangerHover = red;
export const buttonBorderDangerFocus = redLight15;
export const buttonBorderDangerActive = redLight30;
export const buttonLabelDangerDisabled = redLight50;
export const buttonLabelDangerEnabled = white;
export const buttonLabelDangerHover = white;
export const buttonLabelDangerFocus = white;
export const buttonLabelDangerActive = white;
export const buttonBackgroundIconHover = grayLight95;
export const buttonBackgroundIconFocus = grayLight80;
export const buttonBackgroundIconActive = grayLight60;
export const buttonLabelIconDisabled = grayLight50;
export const buttonLabelIconEnabled = grayLight15;
export const buttonLabelIconHover = grayDark55;
export const buttonLabelIconFocus = grayDark55;
export const buttonLabelIconActive = grayDark55;
export const buttonLabelIconInverseDisabled = whiteTransparent70;
export const buttonLabelIconInverseEnabled = whiteTransparent30;
export const buttonLabelIconInverseHover = white;
export const buttonLabelIconInverseFocus = white;
export const buttonLabelIconInverseActive = white;
export const buttonBackgroundIconInverseHover = whiteTransparent90;
export const buttonBackgroundIconInverseFocus = whiteTransparent70;
export const buttonBackgroundIconInverseActive = whiteTransparent50;

export const divider = grayLight80;
export const dividerTransparent = whiteTransparent80;
export const dividerLight = grayLight90;

export const tableBorder = grayLight80;
export const tableHeaderDarkBackground = grayLight15;
export const tableHeaderDarkText = white;
export const tableHeaderLightBackground = nickel;
export const tableHeaderLightText = grayDark55;

export const outlineKeyboardNavigationFocus = blueLight40;

export const series1 = blueLight40;
export const series2 = yellowLight30;
export const series3 = tealDark15;
export const series4 = grayLight80;
export const series5 = purpleLight50;
export const series6 = pinkLight60;
export const series7 = blueLight70;
export const series8 = yellowLight50;
export const series9 = tealLight15;
export const series10 = grayLight50;
export const series11 = purpleLight70;
export const series12 = pinkLight15;

export interface colorTokens {
  white: string;
  silver: string;
  nickel: string;

  brand: string;
  gray: string;
  pink: string;
  purple: string;
  blue: string;
  green: string;
  teal: string;
  yellow: string;
  red: string;

  brandLight15: string;
  brandLight30: string;
  brandLight40: string;
  brandLight50: string;
  brandLight60: string;
  brandLight70: string;
  brandLight80: string;
  brandLight90: string;
  brandLight95: string;
  brandLight99: string;
  brandDark15: string;
  brandDark40: string;
  brandDark55: string;

  grayLight15: string;
  grayLight30: string;
  grayLight40: string;
  grayLight50: string;
  grayLight60: string;
  grayLight70: string;
  grayLight80: string;
  grayLight90: string;
  grayLight95: string;
  grayLight99: string;
  grayDark15: string;
  grayDark40: string;
  grayDark55: string;

  pinkLight15: string;
  pinkLight30: string;
  pinkLight40: string;
  pinkLight50: string;
  pinkLight60: string;
  pinkLight70: string;
  pinkLight80: string;
  pinkLight90: string;
  pinkLight95: string;
  pinkLight99: string;
  pinkDark15: string;
  pinkDark40: string;
  pinkDark55: string;

  purpleLight15: string;
  purpleLight30: string;
  purpleLight40: string;
  purpleLight50: string;
  purpleLight60: string;
  purpleLight70: string;
  purpleLight80: string;
  purpleLight90: string;
  purpleLight95: string;
  purpleLight99: string;
  purpleDark15: string;
  purpleDark40: string;
  purpleDark55: string;

  blueLight15: string;
  blueLight30: string;
  blueLight40: string;
  blueLight50: string;
  blueLight60: string;
  blueLight70: string;
  blueLight80: string;
  blueLight90: string;
  blueLight95: string;
  blueLight99: string;
  blueDark15: string;
  blueDark40: string;
  blueDark55: string;

  greenLight15: string;
  greenLight30: string;
  greenLight40: string;
  greenLight50: string;
  greenLight60: string;
  greenLight70: string;
  greenLight80: string;
  greenLight90: string;
  greenLight95: string;
  greenLight99: string;
  greenDark15: string;
  greenDark40: string;
  greenDark55: string;

  tealLight15: string;
  tealLight30: string;
  tealLight40: string;
  tealLight50: string;
  tealLight60: string;
  tealLight70: string;
  tealLight80: string;
  tealLight90: string;
  tealLight95: string;
  tealLight99: string;
  tealDark15: string;
  tealDark40: string;
  tealDark55: string;

  yellowLight15: string;
  yellowLight30: string;
  yellowLight40: string;
  yellowLight50: string;
  yellowLight60: string;
  yellowLight70: string;
  yellowLight80: string;
  yellowLight90: string;
  yellowLight95: string;
  yellowLight99: string;
  yellowDark15: string;
  yellowDark40: string;
  yellowDark55: string;

  redLight15: string;
  redLight30: string;
  redLight40: string;
  redLight50: string;
  redLight60: string;
  redLight70: string;
  redLight80: string;
  redLight90: string;
  redLight95: string;
  redLight99: string;
  redDark15: string;
  redDark40: string;
  redDark55: string;

  whiteTransparent15: string;
  whiteTransparent30: string;
  whiteTransparent40: string;
  whiteTransparent50: string;
  whiteTransparent60: string;
  whiteTransparent70: string;
  whiteTransparent80: string;
  whiteTransparent90: string;
  whiteTransparent95: string;

  grayTransparent50: string;

  uiBackground: string;
  uiBackgroundAlt: string;
  uiBackgroundModal: string;
  shadow: string;
  shadowRGB: string;

  textPrimary: string;
  textSecondary: string;
  textTertiary: string;
  textPrimaryInverse: string;
  textSecondaryInverse: string;
  textTertiaryInverse: string;

  textLinkDisabled: string;
  textLinkEnabled: string;
  textLinkHover: string;
  textLinkFocus: string;
  textLinkActive: string;
  textLinkVisited: string;

  interactive: string;
  info: string;
  danger: string;
  success: string;
  warning: string;
  dataNegative: string;
  dataPositive: string;

  inputLabel: string;
  inputCaret: string;
  inputValuePlaceholder: string;
  inputLabelDisabled: string;
  valueDisabled: string;
  inputBackgroundDisabled: string;
  inputFocus: string;
  inputInvalid: string;
  inputBorder: string;

  tooltipBackground: string;

  buttonBackgroundTextHover: string;
  buttonBackgroundTextFocus: string;
  buttonBackgroundTextActive: string;
  buttonLabelTextDisabled: string;
  buttonLabelTextEnabled: string;
  buttonLabelTextHover: string;
  buttonLabelTextFocus: string;
  buttonLabelTextActive: string;
  buttonBackgroundOutlinedDisabled: string;
  buttonBackgroundOutlinedEnabled: string;
  buttonBackgroundOutlinedHover: string;
  buttonBackgroundOutlinedFocus: string;
  buttonBackgroundOutlinedActive: string;
  buttonBorderOutlinedDisabled: string;
  buttonBorderOutlinedEnabled: string;
  buttonBorderOutlinedHover: string;
  buttonBorderOutlinedFocus: string;
  buttonBorderOutlinedActive: string;
  buttonLabelOutlinedDisabled: string;
  buttonLabelOutlinedEnabled: string;
  buttonLabelOutlinedHover: string;
  buttonLabelOutlinedFocus: string;
  buttonLabelOutlinedActive: string;
  buttonBackgroundDisabled: string;
  buttonBackgroundEnabled: string;
  buttonBackgroundHover: string;
  buttonBackgroundFocus: string;
  buttonBackgroundActive: string;
  buttonBorderDisabled: string;
  buttonBorderEnabled: string;
  buttonBorderHover: string;
  buttonBorderFocus: string;
  buttonBorderActive: string;
  buttonLabelDisabled: string;
  buttonLabelEnabled: string;
  buttonLabelHover: string;
  buttonLabelFocus: string;
  buttonLabelActive: string;
  buttonBackgroundDangerDisabled: string;
  buttonBackgroundDangerEnabled: string;
  buttonBackgroundDangerHover: string;
  buttonBackgroundDangerFocus: string;
  buttonBackgroundDangerActive: string;
  buttonBorderDangerDisabled: string;
  buttonBorderDangerEnabled: string;
  buttonBorderDangerHover: string;
  buttonBorderDangerFocus: string;
  buttonBorderDangerActive: string;
  buttonLabelDangerDisabled: string;
  buttonLabelDangerEnabled: string;
  buttonLabelDangerHover: string;
  buttonLabelDangerFocus: string;
  buttonLabelDangerActive: string;

  buttonBackgroundIconHover: string;
  buttonBackgroundIconFocus: string;
  buttonBackgroundIconActive: string;
  buttonLabelIconDisabled: string;
  buttonLabelIconEnabled: string;
  buttonLabelIconHover: string;
  buttonLabelIconFocus: string;
  buttonLabelIconActive: string;
  buttonLabelIconInverseDisabled: string;
  buttonLabelIconInverseEnabled: string;
  buttonLabelIconInverseHover: string;
  buttonLabelIconInverseFocus: string;
  buttonLabelIconInverseActive: string;
  buttonBackgroundIconInverseHover: string;
  buttonBackgroundIconInverseFocus: string;
  buttonBackgroundIconInverseActive: string;

  divider: string;
  dividerTransparent: string;
  dividerLight: string;

  tableBorder: string;
  tableHeaderDarkBackground: string;
  tableHeaderDarkText: string;
  tableHeaderLightBackground: string;
  tableHeaderLightText: string;

  outlineKeyboardNavigationFocus: string;

  series1: string;
  series2: string;
  series3: string;
  series4: string;
  series5: string;
  series6: string;
  series7: string;
  series8: string;
  series9: string;
  series10: string;
  series11: string;
  series12: string;
}