@digdir/designsystemet 0.1.0-alpha.13 → 0.1.0-alpha.15

package/dist/src/colors/themeUtils.js

@@ -1,365 +1,336 @@
-// src/colors/themeUtils.ts
 import { BackgroundColor, Color, Theme } from "@adobe/leonardo-contrast-colors";
-import { Hsluv as Hsluv2 } from "hsluv";
-
-// src/colors/colorUtils.ts
 import { Hsluv } from "hsluv";
-import chroma from "chroma-js";
-var hexToRgb = (hex) => {
-  const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
-  hex = hex.replace(shorthandRegex, function(m, r, g, b) {
-    return r + r + g + g + b + b;
-  });
-  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-  return result ? {
-    r: parseInt(result[1], 16),
-    g: parseInt(result[2], 16),
-    b: parseInt(result[3], 16)
-  } : null;
-};
-var luminanceFromRgb = (r, g, b) => {
-  const a = [Number(r), Number(g), Number(b)].map(function(v) {
-    v /= 255;
-    return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
-  });
-  return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
-};
-var luminanceFromHex = (hex) => {
-  const rgb = hexToRgb(hex);
-  if (rgb) {
-    const r = rgb.r.toString();
-    const g = rgb.g.toString();
-    const b = rgb.b.toString();
-    return luminanceFromRgb(r, g, b);
-  }
-  return 2;
-};
-var getRatioFromLum = (lum1, lum2) => {
-  if (lum1 !== null && lum2 !== null) {
-    return (Math.max(lum1, lum2) + 0.05) / (Math.min(lum1, lum2) + 0.05);
-  } else {
-    return -1;
-  }
-};
-var getLightnessFromHex = (hex) => {
-  const conv = new Hsluv();
-  conv.hex = hex;
-  conv.hexToHsluv();
-  return Number(conv.hsluv_l.toFixed(0));
-};
-var getContrastFromHex = (color1, color2) => {
-  const lum1 = luminanceFromHex(color1);
-  const lum2 = luminanceFromHex(color2);
-  if (lum1 !== null && lum2 !== null) {
-    return getRatioFromLum(lum1, lum2);
-  }
-  return -1;
-};
-var getContrastFromLightness = (lightness, mainColor, backgroundColor) => {
-  const conv = new Hsluv();
-  conv.hex = mainColor;
-  conv.hexToHsluv();
-  conv.hsluv_l = lightness;
-  conv.hsluvToHex();
-  const lightMainColor = conv.hex;
-  const lum1 = luminanceFromHex(lightMainColor);
-  const lum2 = luminanceFromHex(backgroundColor);
-  const ratio = getRatioFromLum(lum1 ?? 0, lum2 ?? 0);
-  return ratio;
-};
-
-// src/colors/themeUtils.ts
-var blueBaseColor = "#0A71C0";
-var greenBaseColor = "#078D19";
-var orangeBaseColor = "#CA5C21";
-var purpleBaseColor = "#663299";
-var redBaseColor = "#C01B1B";
-var yellowBaseColor = "#EABF28";
-var generateThemeColor = (color, mode, contrastMode = "aa") => {
-  const leoBackgroundColor = new BackgroundColor({
-    name: "backgroundColor",
-    colorKeys: ["#ffffff"],
-    ratios: [1]
-  });
-  let colorLightness = getLightnessFromHex(color);
-  if (mode === "dark" || mode === "contrast") {
-    color = getBaseColor(color);
-    colorLightness = colorLightness <= 30 ? 70 : 100 - colorLightness;
-  }
-  const multiplier = colorLightness <= 30 ? -8 : 8;
-  const baseDefaultContrast = getContrastFromLightness(colorLightness, color, leoBackgroundColor.colorKeys[0]);
-  const baseHoverContrast = getContrastFromLightness(
-    colorLightness - multiplier,
-    color,
-    leoBackgroundColor.colorKeys[0]
-  );
-  const baseActiveContrast = getContrastFromLightness(
-    colorLightness - multiplier * 2,
-    color,
-    leoBackgroundColor.colorKeys[0]
-  );
-  const textSubLightLightness = contrastMode === "aa" ? 42 : 30;
-  const textDefLightLightness = contrastMode === "aa" ? 18 : 12;
-  const textSubDarkLightness = contrastMode === "aa" ? 67 : 80;
-  const textDefDarkLightness = contrastMode === "aa" ? 90 : 94;
-  let lightnessScale = [];
-  if (mode === "light") {
-    lightnessScale = [100, 96, 90, 84, 78, 76, 54, 33, textSubLightLightness, textDefLightLightness];
-  } else if (mode === "dark") {
-    lightnessScale = [10, 14, 20, 26, 32, 35, 47, 77, textSubDarkLightness, textDefDarkLightness];
-  } else {
-    lightnessScale = [1, 6, 14, 20, 26, 58, 70, 82, 80, 95];
-  }
-  const getColorContrasts = (color2, lightnessScale2, backgroundColor) => {
-    return lightnessScale2.map((lightness) => getContrastFromLightness(lightness, color2, backgroundColor));
-  };
-  return new Color({
-    name: "color",
-    colorKeys: [color],
-    ratios: [
-      ...getColorContrasts(color, lightnessScale.slice(0, 8), leoBackgroundColor.colorKeys[0]),
-      baseDefaultContrast,
-      baseHoverContrast,
-      baseActiveContrast,
-      ...getColorContrasts(color, lightnessScale.slice(8), leoBackgroundColor.colorKeys[0])
-    ]
-  });
+import { getContrastFromHex, getContrastFromLightness, getLightnessFromHex } from "./colorUtils.js";
+const blueBaseColor = '#0A71C0';
+const greenBaseColor = '#078D19';
+const orangeBaseColor = '#CA5C21';
+const purpleBaseColor = '#663299';
+const redBaseColor = '#C01B1B';
+const yellowBaseColor = '#EABF28';
+/**
+ * Generates a Leonardo theme color that is used to create a Leonardo Theme
+ *
+ * @param color CssColor
+ * @param mode Light, Dark or Contrastmode
+ * @param contrastMode Contrast mode
+ * @returns
+ */ const generateThemeColor = (color, mode, contrastMode = 'aa')=>{
+    const leoBackgroundColor = new BackgroundColor({
+        name: 'backgroundColor',
+        colorKeys: [
+            '#ffffff'
+        ],
+        ratios: [
+            1
+        ]
+    });
+    let colorLightness = getLightnessFromHex(color);
+    if (mode === 'dark' || mode === 'contrast') {
+        color = getBaseColor(color);
+        colorLightness = colorLightness <= 30 ? 70 : 100 - colorLightness;
+    }
+    const multiplier = colorLightness <= 30 ? -8 : 8;
+    const baseDefaultContrast = getContrastFromLightness(colorLightness, color, leoBackgroundColor.colorKeys[0]);
+    const baseHoverContrast = getContrastFromLightness(colorLightness - multiplier, color, leoBackgroundColor.colorKeys[0]);
+    const baseActiveContrast = getContrastFromLightness(colorLightness - multiplier * 2, color, leoBackgroundColor.colorKeys[0]);
+    const textSubLightLightness = contrastMode === 'aa' ? 42 : 30;
+    const textDefLightLightness = contrastMode === 'aa' ? 18 : 12;
+    const textSubDarkLightness = contrastMode === 'aa' ? 67 : 80;
+    const textDefDarkLightness = contrastMode === 'aa' ? 90 : 94;
+    let lightnessScale = [];
+    if (mode === 'light') {
+        lightnessScale = [
+            100,
+            96,
+            90,
+            84,
+            78,
+            76,
+            54,
+            33,
+            textSubLightLightness,
+            textDefLightLightness
+        ];
+    } else if (mode === 'dark') {
+        lightnessScale = [
+            10,
+            14,
+            20,
+            26,
+            32,
+            35,
+            47,
+            77,
+            textSubDarkLightness,
+            textDefDarkLightness
+        ];
+    } else {
+        lightnessScale = [
+            1,
+            6,
+            14,
+            20,
+            26,
+            58,
+            70,
+            82,
+            80,
+            95
+        ];
+    }
+    const getColorContrasts = (color, lightnessScale, backgroundColor)=>{
+        return lightnessScale.map((lightness)=>getContrastFromLightness(lightness, color, backgroundColor));
+    };
+    return new Color({
+        name: 'color',
+        colorKeys: [
+            color
+        ],
+        ratios: [
+            ...getColorContrasts(color, lightnessScale.slice(0, 8), leoBackgroundColor.colorKeys[0]),
+            baseDefaultContrast,
+            baseHoverContrast,
+            baseActiveContrast,
+            ...getColorContrasts(color, lightnessScale.slice(8), leoBackgroundColor.colorKeys[0])
+        ]
+    });
 };
-var generateScaleForColor = (color, mode, contrastMode = "aa") => {
-  const themeColor = generateThemeColor(color, mode, contrastMode);
-  const leoBackgroundColor = new BackgroundColor({
-    name: "backgroundColor",
-    colorKeys: ["#ffffff"],
-    ratios: [1]
-  });
-  const theme = new Theme({
-    colors: [themeColor],
-    backgroundColor: leoBackgroundColor,
-    lightness: 100
-  });
-  const outputArray = [];
-  for (let i = 0; i < theme.contrastColorValues.length; i++) {
+/**
+ *
+ * Generates a color scale based on a base color and a mode.
+ *
+ * @param color The base color that is used to generate the color scale
+ * @param mode The mode of the theme
+ */ export const generateScaleForColor = (color, mode, contrastMode = 'aa')=>{
+    const themeColor = generateThemeColor(color, mode, contrastMode);
+    const leoBackgroundColor = new BackgroundColor({
+        name: 'backgroundColor',
+        colorKeys: [
+            '#ffffff'
+        ],
+        ratios: [
+            1
+        ]
+    });
+    const theme = new Theme({
+        colors: [
+            themeColor
+        ],
+        backgroundColor: leoBackgroundColor,
+        lightness: 100
+    });
+    const outputArray = [];
+    for(let i = 0; i < theme.contrastColorValues.length; i++){
+        outputArray.push({
+            hex: theme.contrastColorValues[i],
+            number: i + 1,
+            name: getColorNameFromNumber(i + 1)
+        });
+    }
     outputArray.push({
-      hex: theme.contrastColorValues[i],
-      number: i + 1,
-      name: getColorNameFromNumber(i + 1)
+        hex: calculateContrastOneColor(theme.contrastColorValues[8]),
+        number: 14,
+        name: getColorNameFromNumber(14)
     });
-  }
-  outputArray.push({
-    hex: calculateContrastOneColor(theme.contrastColorValues[8]),
-    number: 14,
-    name: getColorNameFromNumber(14)
-  });
-  outputArray.push({
-    hex: calculateContrastTwoColor(theme.contrastColorValues[8]),
-    number: 15,
-    name: getColorNameFromNumber(15)
-  });
-  if (mode === "light") {
-    outputArray[8].hex = color;
-  }
-  return outputArray;
-};
-var generateThemeForColor = (color, contrastMode = "aa") => {
-  const lightScale = generateScaleForColor(color, "light", contrastMode);
-  const darkScale = generateScaleForColor(color, "dark", contrastMode);
-  const contrastScale = generateScaleForColor(color, "contrast", contrastMode);
-  return {
-    light: lightScale,
-    dark: darkScale,
-    contrast: contrastScale
-  };
+    outputArray.push({
+        hex: calculateContrastTwoColor(theme.contrastColorValues[8]),
+        number: 15,
+        name: getColorNameFromNumber(15)
+    });
+    if (mode === 'light') {
+        outputArray[8].hex = color;
+    }
+    return outputArray;
 };
-var generateGlobalColors = ({ contrastMode = "aa" }) => {
-  const blueTheme = generateThemeForColor(blueBaseColor, contrastMode);
-  const greenTheme = generateThemeForColor(greenBaseColor, contrastMode);
-  const orangeTheme = generateThemeForColor(orangeBaseColor, contrastMode);
-  const purpleTheme = generateThemeForColor(purpleBaseColor, contrastMode);
-  const redTheme = generateThemeForColor(redBaseColor, contrastMode);
-  const yellowTheme = generateThemeForColor(yellowBaseColor, contrastMode);
-  return {
-    blue: blueTheme,
-    green: greenTheme,
-    orange: orangeTheme,
-    purple: purpleTheme,
-    red: redTheme,
-    yellow: yellowTheme
-  };
+/**
+ *
+ * Generates a color theme based on a base color. Light, Dark and Contrast scales are includes.
+ *
+ * @param color The base color that is used to generate the color theme
+ */ export const generateThemeForColor = (color, contrastMode = 'aa')=>{
+    const lightScale = generateScaleForColor(color, 'light', contrastMode);
+    const darkScale = generateScaleForColor(color, 'dark', contrastMode);
+    const contrastScale = generateScaleForColor(color, 'contrast', contrastMode);
+    return {
+        light: lightScale,
+        dark: darkScale,
+        contrast: contrastScale
+    };
 };
-var generateColorTheme = ({ colors, contrastMode = "aa" }) => {
-  const accentTheme = generateThemeForColor(colors.accent, contrastMode);
-  const neutralTheme = generateThemeForColor(colors.neutral, contrastMode);
-  const brand1Theme = generateThemeForColor(colors.brand1, contrastMode);
-  const brand2Theme = generateThemeForColor(colors.brand2, contrastMode);
-  const brand3Theme = generateThemeForColor(colors.brand3, contrastMode);
-  return {
-    accent: accentTheme,
-    neutral: neutralTheme,
-    brand1: brand1Theme,
-    brand2: brand2Theme,
-    brand3: brand3Theme
-  };
+export const generateGlobalColors = ({ contrastMode = 'aa' })=>{
+    const blueTheme = generateThemeForColor(blueBaseColor, contrastMode);
+    const greenTheme = generateThemeForColor(greenBaseColor, contrastMode);
+    const orangeTheme = generateThemeForColor(orangeBaseColor, contrastMode);
+    const purpleTheme = generateThemeForColor(purpleBaseColor, contrastMode);
+    const redTheme = generateThemeForColor(redBaseColor, contrastMode);
+    const yellowTheme = generateThemeForColor(yellowBaseColor, contrastMode);
+    return {
+        blue: blueTheme,
+        green: greenTheme,
+        orange: orangeTheme,
+        purple: purpleTheme,
+        red: redTheme,
+        yellow: yellowTheme
+    };
 };
-var calculateContrastOneColor = (baseColor) => {
-  const contrastWhite = getContrastFromHex(baseColor, "#ffffff");
-  const contrastBlack = getContrastFromHex(baseColor, "#000000");
-  const lightness = contrastWhite >= contrastBlack ? 100 : 0;
-  return lightness === 0 ? "#000000" : "#ffffff";
+/**
+ * This function generates a complete theme for a set of colors.
+ *
+ * @param colors Which colors to generate the theme for
+ * @param contrastMode The contrast mode to use
+ * @returns
+ */ export const generateColorTheme = ({ colors, contrastMode = 'aa' })=>{
+    const accentTheme = generateThemeForColor(colors.accent, contrastMode);
+    const neutralTheme = generateThemeForColor(colors.neutral, contrastMode);
+    const brand1Theme = generateThemeForColor(colors.brand1, contrastMode);
+    const brand2Theme = generateThemeForColor(colors.brand2, contrastMode);
+    const brand3Theme = generateThemeForColor(colors.brand3, contrastMode);
+    return {
+        accent: accentTheme,
+        neutral: neutralTheme,
+        brand1: brand1Theme,
+        brand2: brand2Theme,
+        brand3: brand3Theme
+    };
 };
-var calculateContrastTwoColor = (color) => {
-  const contrastWhite = getContrastFromHex(color, "#ffffff");
-  const contrastBlack = getContrastFromHex(color, "#000000");
-  const lightness = getLightnessFromHex(color);
-  const doubleALightnessModifier = lightness <= 40 ? 60 : lightness >= 60 ? 60 : 50;
-  let targetLightness = 0;
-  const contrastDirection = contrastWhite >= contrastBlack ? "lighten" : "darken";
-  targetLightness = contrastDirection === "lighten" ? lightness + doubleALightnessModifier : lightness - doubleALightnessModifier;
-  return createColorWithLightness(color, targetLightness);
+/**
+ *
+ * This function calculates a color that can be used as a strong contrast color to a base color.
+ *
+ * @param baseColor The base color
+ */ export const calculateContrastOneColor = (baseColor)=>{
+    const contrastWhite = getContrastFromHex(baseColor, '#ffffff');
+    const contrastBlack = getContrastFromHex(baseColor, '#000000');
+    const lightness = contrastWhite >= contrastBlack ? 100 : 0;
+    // const color = createColorWithLightness(baseColor, lightness);
+    return lightness === 0 ? '#000000' : '#ffffff';
 };
-var canTextBeUsedOnColors = (baseDefaultColor, baseActiveColor) => {
-  const defaultAgainstWhite = getContrastFromHex(baseDefaultColor, "#ffffff");
-  const defaultAgainstBlack = getContrastFromHex(baseDefaultColor, "#000000");
-  const activeAgainstWhite = getContrastFromHex(baseActiveColor, "#ffffff");
-  const activeAgainstBlack = getContrastFromHex(baseActiveColor, "#000000");
-  if (defaultAgainstWhite >= 4.5 && activeAgainstWhite >= 4.5) {
-    return true;
-  } else if (defaultAgainstBlack >= 4.5 && activeAgainstBlack >= 4.5) {
-    return true;
-  }
-  return false;
+/**
+ *
+ * This function calculates a color that can be used as a subtle contrast color to a base color.
+ *
+ * @param color The base color
+ */ export const calculateContrastTwoColor = (color)=>{
+    const contrastWhite = getContrastFromHex(color, '#ffffff');
+    const contrastBlack = getContrastFromHex(color, '#000000');
+    const lightness = getLightnessFromHex(color);
+    const doubleALightnessModifier = lightness <= 40 ? 60 : lightness >= 60 ? 60 : 50;
+    let targetLightness = 0;
+    const contrastDirection = contrastWhite >= contrastBlack ? 'lighten' : 'darken';
+    targetLightness = contrastDirection === 'lighten' ? lightness + doubleALightnessModifier : lightness - doubleALightnessModifier;
+    return createColorWithLightness(color, targetLightness);
 };
-var createColorWithLightness = (color, lightness) => {
-  const leoBackgroundColor = new BackgroundColor({
-    name: "backgroundColor",
-    colorKeys: ["#ffffff"],
-    ratios: [1]
-  });
-  const colors = new Color({
-    name: "color",
-    colorKeys: [color],
-    ratios: [getContrastFromLightness(lightness, color, "#ffffff")]
-  });
-  const theme = new Theme({
-    colors: [colors],
-    backgroundColor: leoBackgroundColor,
-    lightness: 100
-  });
-  return theme.contrastColorValues[0];
+/**
+ *
+ * This function checks if white or black text can be used on 2 different colors at 4.5:1 contrast.
+ *
+ * @param baseDefaultColor Base default color
+ * @param baseActiveColor Base active color
+ */ export const canTextBeUsedOnColors = (baseDefaultColor, baseActiveColor)=>{
+    const defaultAgainstWhite = getContrastFromHex(baseDefaultColor, '#ffffff');
+    const defaultAgainstBlack = getContrastFromHex(baseDefaultColor, '#000000');
+    const activeAgainstWhite = getContrastFromHex(baseActiveColor, '#ffffff');
+    const activeAgainstBlack = getContrastFromHex(baseActiveColor, '#000000');
+    if (defaultAgainstWhite >= 4.5 && activeAgainstWhite >= 4.5) {
+        return true;
+    } else if (defaultAgainstBlack >= 4.5 && activeAgainstBlack >= 4.5) {
+        return true;
+    }
+    return false;
 };
-var getColorNumberFromName = (name) => {
-  const colorMap = {
-    "Background Default": 1,
-    "Background Subtle": 2,
-    "Surface Default": 3,
-    "Surface Hover": 4,
-    "Surface Active": 5,
-    "Border Subtle": 6,
-    "Border Default": 7,
-    "Border Strong": 8,
-    "Base Default": 9,
-    "Base Hover": 10,
-    "Base Active": 11,
-    "Text Subtle": 12,
-    "Text Default": 13,
-    "Contrast Default": 14,
-    "Contrast Subtle": 15
-  };
-  return colorMap[name];
+/**
+ *
+ * This function creates a color with a specific lightness value.
+ *
+ * @param color The base color
+ * @param lightness The lightness value from 0 to 100
+ */ export const createColorWithLightness = (color, lightness)=>{
+    const leoBackgroundColor = new BackgroundColor({
+        name: 'backgroundColor',
+        colorKeys: [
+            '#ffffff'
+        ],
+        ratios: [
+            1
+        ]
+    });
+    const colors = new Color({
+        name: 'color',
+        colorKeys: [
+            color
+        ],
+        ratios: [
+            getContrastFromLightness(lightness, color, '#ffffff')
+        ]
+    });
+    const theme = new Theme({
+        colors: [
+            colors
+        ],
+        backgroundColor: leoBackgroundColor,
+        lightness: 100
+    });
+    return theme.contrastColorValues[0];
 };
-var getColorNameFromNumber = (number) => {
-  const colorMap = {
-    1: "Background Default",
-    2: "Background Subtle",
-    3: "Surface Default",
-    4: "Surface Hover",
-    5: "Surface Active",
-    6: "Border Subtle",
-    7: "Border Default",
-    8: "Border Strong",
-    9: "Base Default",
-    10: "Base Hover",
-    11: "Base Active",
-    12: "Text Subtle",
-    13: "Text Default",
-    14: "Contrast Default",
-    15: "Contrast Subtle"
-  };
-  return colorMap[number];
+/**
+ *
+ * This function returns the color number based on the color name.
+ *
+ * @param name The name of the color
+ */ export const getColorNumberFromName = (name)=>{
+    const colorMap = {
+        'Background Default': 1,
+        'Background Subtle': 2,
+        'Surface Default': 3,
+        'Surface Hover': 4,
+        'Surface Active': 5,
+        'Border Subtle': 6,
+        'Border Default': 7,
+        'Border Strong': 8,
+        'Base Default': 9,
+        'Base Hover': 10,
+        'Base Active': 11,
+        'Text Subtle': 12,
+        'Text Default': 13,
+        'Contrast Default': 14,
+        'Contrast Subtle': 15
+    };
+    return colorMap[name];
 };
-var getBaseColor = (color) => {
-  const conv = new Hsluv2();
-  conv.hex = color;
-  conv.hexToHsluv();
-  conv.hsluvToHex();
-  return conv.hex;
+/**
+ *
+ * This function returns the color name based on the color number.
+ *
+ * @param number The number of the color
+ */ export const getColorNameFromNumber = (number)=>{
+    const colorMap = {
+        1: 'Background Default',
+        2: 'Background Subtle',
+        3: 'Surface Default',
+        4: 'Surface Hover',
+        5: 'Surface Active',
+        6: 'Border Subtle',
+        7: 'Border Default',
+        8: 'Border Strong',
+        9: 'Base Default',
+        10: 'Base Hover',
+        11: 'Base Active',
+        12: 'Text Subtle',
+        13: 'Text Default',
+        14: 'Contrast Default',
+        15: 'Contrast Subtle'
+    };
+    return colorMap[number];
 };
-var getCssVariable = (colorType, colorNumber) => {
-  return `--ds-${colorType}-${getColorNameFromNumber(colorNumber).toLowerCase().replace(/\s/g, "-")}`;
+export const getBaseColor = (color)=>{
+    const conv = new Hsluv();
+    conv.hex = color;
+    conv.hexToHsluv();
+    // conv.hsluv_l = 100 - conv.hsluv_l;
+    // conv.hsluv_s = getSaturationForDarkMode(color, conv.hsluv_s);
+    conv.hsluvToHex();
+    return conv.hex;
 };
-export {
-  calculateContrastOneColor,
-  calculateContrastTwoColor,
-  canTextBeUsedOnColors,
-  createColorWithLightness,
-  generateColorTheme,
-  generateGlobalColors,
-  generateScaleForColor,
-  generateThemeForColor,
-  getBaseColor,
-  getColorNameFromNumber,
-  getColorNumberFromName,
-  getCssVariable
+export const getCssVariable = (colorType, colorNumber)=>{
+    return `--ds-${colorType}-${getColorNameFromNumber(colorNumber).toLowerCase().replace(/\s/g, '-')}`;
 };
-/*! Bundled license information:
-
-colorparsley/src/colorparsley.js:
-  (** @preserve
-  /////    CoLoR PaRsLeY  a simple set of color parsing thingies!
-  /////           Beta 0.1.8   Revision date: June 04, 2022
-  /////
-  /////    Functions to parse color values and return array
-  /////    Copyright (c) 2019-2022 by Andrew Somers. All Rights Reserved.
-  /////    LICENSE: AGPL 3
-  /////    CONTACT: Please use the ISSUES or DISCUSSIONS tab at:
-  /////    https://github.com/Myndex/colorparsley/
-  /////
-  ///////////////////////////////////////////////////////////////////////////////
-  /////
-  /////    IMPORT:
-  /////    import { colorParsley } from 'colorparsley';
-  /////
-  /////    let rgbaArray = colorParsley('#abcdef');
-  /////
-  /////    Output as array:  [r,g,b,a,isValid,colorspace]
-  /////    Example: [123,123,123,1.0,true,'sRGB']
-  // *)
-
-apca-w3/src/apca-w3.js:
-  (** @preserve
-  /////    SAPC APCA - Advanced Perceptual Contrast Algorithm
-  /////           Beta 0.1.9 W3 • contrast function only
-  /////           DIST: W3 • Revision date: July 3, 2022
-  /////    Function to parse color values and determine Lc contrast
-  /////    Copyright © 2019-2022 by Andrew Somers. All Rights Reserved.
-  /////    LICENSE: W3 LICENSE
-  /////    CONTACT: Please use the ISSUES or DISCUSSIONS tab at:
-  /////    https://github.com/Myndex/SAPC-APCA/
-  /////
-  ///////////////////////////////////////////////////////////////////////////////
-  /////
-  /////    MINIMAL IMPORTS:
-  /////      import { APCAcontrast, sRGBtoY, displayP3toY,
-  /////               calcAPCA, fontLookupAPCA } from 'apca-w3';
-  /////      import { colorParsley } from 'colorparsley';
-  /////
-  /////    FORWARD CONTRAST USAGE:
-  /////      Lc = APCAcontrast( sRGBtoY( TEXTcolor ) , sRGBtoY( BACKGNDcolor ) );
-  /////    Where the colors are sent as an rgba array [255,255,255,1]
-  /////
-  /////    Retrieving an array of font sizes for the contrast:
-  /////      fontArray = fontLookupAPCA(Lc);
-  /////
-  /////    Live Demonstrator at https://www.myndex.com/APCA/
-  // *)
-*/
-//# sourceMappingURL=themeUtils.js.map