1import Theme, { BackgroundColorSet } from "../themes/common/theme";
  2import { fontFamilies, fontSizes, FontWeight } from "../common";
  3
  4export type TextColor = keyof Theme["textColor"];
  5export function text(
  6  theme: Theme,
  7  fontFamily: keyof typeof fontFamilies,
  8  color: TextColor,
  9  properties?: {
 10    size?: keyof typeof fontSizes;
 11    weight?: FontWeight;
 12    underline?: boolean;
 13  }
 14) {
 15  let size = fontSizes[properties?.size || "sm"];
 16  return {
 17    family: fontFamilies[fontFamily],
 18    color: theme.textColor[color],
 19    ...properties,
 20    size,
 21  };
 22}
 23export function textColor(theme: Theme, color: TextColor) {
 24  return theme.textColor[color];
 25}
 26
 27export type BorderColor = keyof Theme["borderColor"];
 28export interface BorderOptions {
 29  width?: number;
 30  top?: boolean;
 31  bottom?: boolean;
 32  left?: boolean;
 33  right?: boolean;
 34  overlay?: boolean;
 35}
 36export function border(
 37  theme: Theme,
 38  color: BorderColor,
 39  options?: BorderOptions
 40) {
 41  return {
 42    color: borderColor(theme, color),
 43    width: 1,
 44    ...options,
 45  };
 46}
 47export function borderColor(theme: Theme, color: BorderColor) {
 48  return theme.borderColor[color];
 49}
 50
 51export type IconColor = keyof Theme["iconColor"];
 52export function iconColor(theme: Theme, color: IconColor) {
 53  return theme.iconColor[color];
 54}
 55
 56export type PlayerIndex = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
 57export interface Player {
 58  selection: {
 59    cursor: string;
 60    selection: string;
 61  };
 62}
 63export function player(theme: Theme, playerNumber: PlayerIndex): Player {
 64  return {
 65    selection: {
 66      cursor: theme.player[playerNumber].cursorColor,
 67      selection: theme.player[playerNumber].selectionColor,
 68    },
 69  };
 70}
 71
 72export type BackgroundColor = keyof Theme["backgroundColor"];
 73export type BackgroundState = keyof BackgroundColorSet;
 74export function backgroundColor(
 75  theme: Theme,
 76  name: BackgroundColor,
 77  state?: BackgroundState
 78): string {
 79  return theme.backgroundColor[name][state || "base"];
 80}
 81
 82export function modalShadow(theme: Theme) {
 83  return {
 84    blur: 16,
 85    color: theme.shadow,
 86    offset: [0, 2],
 87  };
 88}
 89
 90export function popoverShadow(theme: Theme) {
 91  return {
 92    blur: 4,
 93    color: theme.shadow,
 94    offset: [1, 2],
 95  };
 96}
 97
 98export function draggedShadow(theme: Theme) {
 99  return {
100    blur: 6,
101    color: theme.shadow,
102    offset: [1, 2],
103  };
104}