import { createTheme } from "@vanilla-extract/css";
import { vars } from "./vars.css.mjs";
import { makeVanillaTheme } from "./makeVanillaTheme.mjs";
import mapValues from "lodash/mapValues.js";
import { isLight } from "../utils/index.mjs";
const makeWebFonts = (webFont) => {
  if (!webFont) {
    return [];
  }
  return [{ linkTag: `<link href="${webFont}" rel="stylesheet" />` }];
};
const makeRuntimeTokens = (tokens) => ({
  name: tokens.name,
  displayName: tokens.displayName,
  /**
   * The boundary for making updated design decisions without disturbing
   * existing consumers. Updated decisions can be assessed as part of
   * migrating between themes.
   *
   * This token will be removed when the `apac` theme is retired.
   */
  legacy: tokens.legacy,
  background: {
    lightMode: tokens.color.background.body,
    darkMode: tokens.color.background.bodyDark
  },
  webFonts: makeWebFonts(tokens.typography.webFont),
  space: {
    grid: tokens.grid,
    space: tokens.space
  },
  color: tokens.color,
  backgroundLightness: mapValues(
    tokens.color.background,
    (background, name) => {
      const referenceColorMap = {
        brandAccentActive: "brandAccent",
        brandAccentHover: "brandAccent",
        formAccentActive: "formAccent",
        formAccentHover: "formAccent"
      };
      const referenceColor = name in referenceColorMap ? tokens.color.background[referenceColorMap[name]] : background;
      if (!referenceColor) {
        throw new Error(
          `Error resolving background lightness for background "${background}" in "${tokens.name}" theme.`
        );
      }
      return isLight(referenceColor, tokens.color.foreground.neutral) ? "light" : "dark";
    }
  )
});
const makeBraidTheme = (tokens) => ({
  ...makeRuntimeTokens(tokens),
  vanillaTheme: createTheme(vars, makeVanillaTheme(tokens), tokens.name)
});
export {
  makeBraidTheme
};
