{"version":3,"sources":["../../src/theme/theme-utils.ts"],"sourcesContent":["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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,iBAA0B;AAK1B,8BAAiC;AAG1B,IAAM,qBAAqB,CAC9B,OACA,KACA,aAAsB,SACrB;AACD,QAAM,aACF,MAAM,WACR,GAAG;AACL,SAAO;AAAA,MACL,aAAa,GAAG,GAAG,OAAO,EAAE;AAAA,eACnB,WAAW,KAAK;AAAA,qBACV,WAAW,UAAU;AAAA,sBACpB,WAAW,UAAU;AAAA,oBACvB,WAAW,QAAQ;AAAA,sBACjB,WAAW,UAAU;AAAA,iBAC1B,WAAW,MAAM;AAAA,MAC5B,aAAa,MAAM,EAAE;AAAA;AAE3B;AAEO,IAAM,uBAAuB,CAChC,aACA,aAA0B,OAAO,KAAK,WAAW,MAChD;AAGD,SAAO,WAAW,OAAO,CAAC,KAAgB,cAAuB;AAC7D,QAAI,SAAS,IAAI,YAAY,SAAS,EAAE,MAAM,SAAS;AACvD,WAAO;AAAA,EACX,GAAG,CAAC,CAAc;AACtB;AAMA,IAAM,4BAA4B,CAAC,WAAmB,UAA0C;AAC5F,SAAO;AAAA,IACH;AAAA,IACA,mBAAe,0CAAiB,WAAW,KAAK;AAAA,EACpD;AACJ;AAQO,IAAM,kBAAkB,CAC3B,iBACA,OAAqB,SACrB,uBAAuB,QACtB;AACD,QAAM,cAAc;AAAA,IAChB;AAAA,IACA,WAAAA,QAAc,QAAQ,IAAI,EAAE,KAAK,QAAQ,QAAQ;AAAA,EACrD;AAEA,QAAM,eAAe;AAAA,IACjB;AAAA,IACA,WAAAA,QAAc,QAAQ,IAAI,EAAE,KAAK,QAAQ,SAAS;AAAA,EACtD;AAEA,QAAM,gBAAgB;AAAA,IAClB;AAAA,IACA,WAAAA,QAAc,QAAQ,IAAI,EAAE,KAAK,UAAU,QAAQ;AAAA,EACvD;AAGA,MAAI,YAAY,iBAAiB,sBAAsB;AACnD,WAAO,YAAY;AAAA,EACvB;AAGA,QAAM,+BAA+B,CAAC,aAAa,cAAc,aAAa,EAAE;AAAA,IAC5E,CAAC,GAAG,MAAM,EAAE,gBAAgB,EAAE;AAAA,EAClC;AAEA,SAAO,6BAA6B,CAAC,EAAE;AAC3C;AAEO,IAAM,eAAe,CAAC,OAAc,QAAiD;AACxF,SAAO,OAAO,MAAM;AACxB;","names":["varnishTokens"]}