{"version":3,"sources":["../../src/theme/colors.ts","../../../../node_modules/hex-rgb/index.js","../../src/theme/theme-utils.ts"],"sourcesContent":["import hexRgb from 'hex-rgb';\nimport type { ColorKeys } from '@allenai/varnish-theme/mui';\nimport varnishTheme from '@allenai/varnish-theme/mui';\n\nimport { getContrastText } from './theme-utils';\n\ntype VarnishThemeColor = (typeof varnishTheme)['color'][ColorKeys];\n\nexport class RGBA {\n    constructor(\n        public r: number,\n        public g: number,\n        public b: number,\n        public a: number\n    ) {}\n\n    toString() {\n        return `rgba(${this.r}, ${this.g}, ${this.b}, ${this.a})`;\n    }\n}\n\n// convert a hex color string to a RGBA\nexport function hexToRgb(hex: string): RGBA {\n    const rgba = hexRgb(hex);\n    return new RGBA(rgba.red, rgba.green, rgba.blue, rgba.alpha);\n}\n\nexport class Color {\n    public readonly displayName: string;\n    public readonly hex: string;\n    public readonly rgba: RGBA;\n\n    public readonly useContrastText: boolean;\n    public readonly contrastTextColor: string;\n\n    constructor(displayName: string, hex: string, rgba?: RGBA, useContrastText?: boolean) {\n        this.displayName = displayName;\n        this.hex = hex.toUpperCase();\n        this.rgba = rgba || hexToRgb(hex);\n        this.useContrastText = useContrastText ?? false;\n        this.contrastTextColor = getContrastText(this.hex);\n    }\n\n    toString() {\n        return this.hex;\n    }\n}\n\n// get color from style token\nconst getColor = (color: VarnishThemeColor) => {\n    const c = color.attributes;\n    const rgba = new RGBA(c.rgb.r, c.rgb.g, c.rgb.b, c.rgb.a);\n    const useContrastText = 'useContrastText' in c ? c.useContrastText : false;\n\n    // Include alpha in hex when it's not fully opaque\n    const alphaHex =\n        c.rgb.a < 1\n            ? Math.round(c.rgb.a * 255)\n                  .toString(16)\n                  .padStart(2, '0')\n            : '';\n    const hex = `#${c.hex.toUpperCase()}${alphaHex.toUpperCase()}`;\n\n    const colorName = color.name.replace('color-', '');\n    // Make color names formatted like B10 or R2 uppercase\n    const displayName = colorName.match(/^\\D\\d+$/) ? colorName.toUpperCase() : colorName;\n    return new Color(displayName, hex, rgba, useContrastText);\n};\n\n// colors grabbed from varnish-theme\nexport const color = Object.entries(varnishTheme.color).reduce(\n    (acc, [k, v]) => {\n        acc[k as ColorKeys] = getColor(v);\n        return acc;\n    },\n    {} as Record<ColorKeys, Color>\n);\n\n// TODO: these should pull from VarnishTheme. This is not currently done because the VarnishTheme\n// does not expose hex nor a color id like 'R10'. And converting from string rgb is not ideal.\n// This will likely be reworked in the future due to new branding. (very likely, we wont expose\n// charting colors from the mui theme at all)\nexport const lightCategoricalColor = {\n    Red: new Color('Red', color.R10.hex, color.R10.rgba, color.R10.useContrastText),\n    Orange: new Color('Orange', color.O9.hex, color.O9.rgba, color.O9.useContrastText),\n    Aqua: new Color('Aqua', color.A10.hex, color.A10.rgba, color.A10.useContrastText),\n    Teal: new Color('Teal', color.T8.hex, color.T8.rgba, color.T8.useContrastText),\n    Blue: new Color('Blue', color.B6.hex, color.B6.rgba, color.B6.useContrastText),\n    Magenta: new Color('Magenta', color.M10.hex, color.M10.rgba, color.M10.useContrastText),\n    Purple: new Color('Purple', color.P8.hex, color.P8.rgba, color.P8.useContrastText),\n    Green: new Color('Green', color.G10.hex, color.G10.rgba, color.G10.useContrastText),\n} as const satisfies Record<string, Color>;\n\nexport const darkCategoricalColor = {\n    Red: new Color('Red', color.R4.hex, color.R4.rgba, color.R4.useContrastText),\n    Orange: new Color('Orange', color.O4.hex, color.O4.rgba, color.O4.useContrastText),\n    Aqua: new Color('Aqua', color.A3.hex, color.A3.rgba, color.A3.useContrastText),\n    Teal: new Color('Teal', color.T3.hex, color.T3.rgba, color.T3.useContrastText),\n    Blue: new Color('Blue', color.B3.hex, color.B3.rgba, color.B3.useContrastText),\n    Magenta: new Color('Magenta', color.M4.hex, color.M4.rgba, color.M4.useContrastText),\n    Purple: new Color('Purple', color.P4.hex, color.P4.rgba, color.P4.useContrastText),\n    Green: new Color('Green', color.G4.hex, color.G4.rgba, color.G4.useContrastText),\n} as const satisfies Record<string, Color>;\n\n// use to convert a set of color ids top their hex values\n// e.g. SequenceColors = ColorsIdsToHexVals(['N1', 'N3', 'N5', 'N7', 'N9']);\nexport const colorsIdsToHexVals = (colorIds: Array<keyof typeof color>) =>\n    colorIds.map((k) => color[k].hex);\nexport const colorMapToHexVals = (\n    colorMap: typeof darkCategoricalColor | typeof lightCategoricalColor | typeof color\n) => Object.values(colorMap).map((v) => v.hex);\n","const hexCharacters = 'a-f\\\\d';\nconst match3or4Hex = `#?[${hexCharacters}]{3}[${hexCharacters}]?`;\nconst match6or8Hex = `#?[${hexCharacters}]{6}([${hexCharacters}]{2})?`;\nconst nonHexChars = new RegExp(`[^#${hexCharacters}]`, 'gi');\nconst validHexSize = new RegExp(`^${match3or4Hex}$|^${match6or8Hex}$`, 'i');\n\nexport default function hexRgb(hex, options = {}) {\n\tif (typeof hex !== 'string' || nonHexChars.test(hex) || !validHexSize.test(hex)) {\n\t\tthrow new TypeError('Expected a valid hex string');\n\t}\n\n\thex = hex.replace(/^#/, '');\n\tlet alphaFromHex = 1;\n\n\tif (hex.length === 8) {\n\t\talphaFromHex = Number.parseInt(hex.slice(6, 8), 16) / 255;\n\t\thex = hex.slice(0, 6);\n\t}\n\n\tif (hex.length === 4) {\n\t\talphaFromHex = Number.parseInt(hex.slice(3, 4).repeat(2), 16) / 255;\n\t\thex = hex.slice(0, 3);\n\t}\n\n\tif (hex.length === 3) {\n\t\thex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];\n\t}\n\n\tconst number = Number.parseInt(hex, 16);\n\tconst red = number >> 16;\n\tconst green = (number >> 8) & 255;\n\tconst blue = number & 255;\n\tconst alpha = typeof options.alpha === 'number' ? options.alpha : alphaFromHex;\n\n\tif (options.format === 'array') {\n\t\treturn [red, green, blue, alpha];\n\t}\n\n\tif (options.format === 'css') {\n\t\tconst alphaString = alpha === 1 ? '' : ` / ${Number((alpha * 100).toFixed(2))}%`;\n\t\treturn `rgb(${red} ${green} ${blue}${alphaString})`;\n\t}\n\n\treturn {red, green, blue, alpha};\n}\n","import type { PaletteModes } from '@allenai/varnish-theme/mui';\nimport varnishTokens from '@allenai/varnish-theme/mui';\nimport { type Theme } from '@mui/material';\nimport type { TypographyVariant } from '@mui/material/styles';\n\n// importing from @mui/system directly seems to get us around some client component issues in Next\nimport { getContrastRatio } from '@mui/system/colorManipulator';\n\n// Used to convert style object to css for typographic elements like h1...h6\nexport const getTypographyStyle = (\n    theme: Omit<Theme, 'components'>,\n    key: TypographyVariant,\n    includeKey: boolean = true\n) => {\n    const typography = (\n        theme.typography as unknown as Record<string, Record<string, string | number | undefined>>\n    )[key];\n    return `\n    ${includeKey ? `${key} {` : ''}\n      color: ${typography.color};\n      font-family: ${typography.fontFamily};\n      font-weight:  ${typography.fontWeight};\n      font-size:  ${typography.fontSize};\n      line-height:  ${typography.lineHeight};\n      margin:  ${typography.margin};\n    ${includeKey ? '}' : ''}\n  `;\n};\n\nexport const getThemeObjectTokens = <T extends { [index: string]: { value: string | number } }>(\n    themeObject: T,\n    properties: (keyof T)[] = Object.keys(themeObject)\n) => {\n    type RecordOfT = Record<keyof T, string>;\n\n    return properties.reduce((acc: RecordOfT, attribute: keyof T) => {\n        acc[attribute] = themeObject[attribute].value.toString();\n        return acc;\n    }, {} as RecordOfT);\n};\n\ninterface ColorWithContrastRatio {\n    color: string;\n    contrastRatio: number;\n}\nconst getColorWithContrastRatio = (baseColor: string, color: string): ColorWithContrastRatio => {\n    return {\n        color,\n        contrastRatio: getContrastRatio(baseColor, color),\n    };\n};\n\n/**\n *\n * @param backgroundColor The color you want to get the contrast color for\n * @param mode 'light' or 'dark', this determines which palette we pull text colors from\n * @returns The primary or reversed value for the palette mode selected, chosen based on whichever has the better contrast ratio\n */\nexport const getContrastText = (\n    backgroundColor: string,\n    mode: PaletteModes = 'light',\n    desiredContrastRatio = 4.5\n) => {\n    const primaryText = getColorWithContrastRatio(\n        backgroundColor,\n        varnishTokens.palette[mode].text.primary.default.value\n    );\n\n    const reversedText = getColorWithContrastRatio(\n        backgroundColor,\n        varnishTokens.palette[mode].text.primary.reversed.value\n    );\n\n    const secondaryText = getColorWithContrastRatio(\n        backgroundColor,\n        varnishTokens.palette[mode].text.secondary.default.value\n    );\n\n    // HACK: dark-green will always have better contrast than ai2-green. This lets us keep using ai2-green if it's above the contrast ratio we're looking for\n    if (primaryText.contrastRatio >= desiredContrastRatio) {\n        return primaryText.color;\n    }\n\n    // We want the color with the highest contrast ratio at the first index\n    const colorsOrderedByContrastRatio = [primaryText, reversedText, secondaryText].sort(\n        (a, b) => b.contrastRatio - a.contrastRatio\n    );\n\n    return colorsOrderedByContrastRatio[0].color;\n};\n\nexport const isThemeColor = (theme: Theme, key: string): key is keyof typeof theme.color => {\n    return key in theme.color;\n};\n"],"mappings":"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","names":["import_mui","color","varnishTokens","color","varnishTheme"]}