import { getThemeName } from '../utils';
import lendiTypography from './themes/lendi';
import lendiNextTypography from './themes/lendi-next';
import domainTypography from './themes/domain';
import aussieTypography from './themes/aussie';

import getFontMetrics from './font-metrics/getFontMetrics';

export const textVariants = [
  /*
   * @deprecated use 'display1' instead
   */
  'display',
  'display1',
  'display2',
  'title1',
  'title2',
  'title3',
  'title4',
  'lead1',
  'lead2',
  'subtitle1',
  'subtitle2',
  'body1',
  'body2',
  'button1',
  'button2',
  'detail1',
  'detail2',
  'overline',
] as const;

type Properties = 'fontFamily' | 'fontWeight' | 'fontMetrics';

export type TextVariant = typeof textVariants[any];
export interface FontMetrics {
  capHeight: number;
  ascent: number;
  descent: number;
  lineGap: number;
  unitsPerEm: number;
}

function getTypography(variant: TextVariant, property: 'fontFamily'): string;
function getTypography(variant: TextVariant, property: 'fontWeight'): number;
function getTypography(variant: TextVariant, property: 'fontMetrics'): FontMetrics;

function getTypography(variant: TextVariant, property: Properties): string | number | FontMetrics {
  const themeName = getThemeName();

  const baseTypography = lendiNextTypography;

  const themeTypography = {
    // This is a bit confusing, but because Lendi Next is the foundation for all themes, on order to
    // create the "legacy" set of typography, we need to merge them together here to form
    // the default.
    lendi: Object.assign({}, baseTypography, lendiTypography),
    'lendi-next': baseTypography,
    domain: Object.assign({}, baseTypography, domainTypography),
    aussie: Object.assign({}, baseTypography, aussieTypography),
  };

  if (property === 'fontMetrics') {
    return getFontMetrics(themeTypography[themeName][variant].fontFamily);
  }

  return themeTypography[themeName][variant][property];
}

export default getTypography;