import { ThemeMap, ColorsMap } from '../../types';
import { ThemeName } from '@lendi-ui/commons/utils';
import { mapToColorsLegacyFormat } from '../../utils';
import tokens from './token.json';

const themeName: ThemeName = 'domain';

/**
 * @deprecated Use tokens instead
 */
const typography = {
  /**
   * @deprecated Use `asset.font.heading.family` instead
   */
  heading: {
    fontFamily: tokens.asset.font.heading.family,
  },
  /**
   * @deprecated Use `asset.font.body.family` instead
   */
  body: {
    fontFamily: tokens.asset.font.body.family,
  },
};

/**
 * @deprecated Use `theme.name` instead
 * @example
 * import { useTheme } from '@lendi/ui/Theme';
 *
 * const theme = useTheme();
 * const themeName = theme.name;
 */
const logo = {
  logoName: 'DomainLogo',
};

const borderRadius = '3px';

/**
 * @deprecated Use `theme.color.xxx.yyy` instead. Will be removed in future major release.
 * @example
 * const theme = useTheme();
 * theme.color.interaction.main;
 */
// @ts-expect-error
const colors: ColorsMap = mapToColorsLegacyFormat(tokens.color);

/**
 * @since 9.2.3
 */
type Token = typeof tokens;
export const domainTheme: ThemeMap & Token = {
  typography,
  colors,
  logo,
  borderRadius,
  ...tokens,
  name: themeName,
};