import {
  ColorHue,
  Colors,
  ColorsWithHue,
  SimpleColors,
} from '../theme/primitives/colors';
import { useTheme } from './useTheme';

export const useResolvedColor = (color?: ColorsWithHue) => {
  const { colors } = useTheme();

  if (!color) return color;

  if (color.includes('.')) {
    const [key, hue] = color.split('.') as [keyof Colors, ColorHue];
    return colors[key][hue];
  }

  return colors[color as SimpleColors];
};