@ui5/webcomponents-base 0.0.0-9ed6f23c6 → 0.0.0-a3b95fa49

package/dist/util/ColorConversion.js

@@ -5,157 +5,156 @@
 /**
  * Map of CSS colors to hex representation
  */
-var CSSColors;
-(function (CSSColors) {
-    CSSColors["aliceblue"] = "f0f8ff";
-    CSSColors["antiquewhite"] = "faebd7";
-    CSSColors["aqua"] = "00ffff";
-    CSSColors["aquamarine"] = "7fffd4";
-    CSSColors["azure"] = "f0ffff";
-    CSSColors["beige"] = "f5f5dc";
-    CSSColors["bisque"] = "ffe4c4";
-    CSSColors["black"] = "000000";
-    CSSColors["blanchedalmond"] = "ffebcd";
-    CSSColors["blue"] = "0000ff";
-    CSSColors["blueviolet"] = "8a2be2";
-    CSSColors["brown"] = "a52a2a";
-    CSSColors["burlywood"] = "deb887";
-    CSSColors["cadetblue"] = "5f9ea0";
-    CSSColors["chartreuse"] = "7fff00";
-    CSSColors["chocolate"] = "d2691e";
-    CSSColors["coral"] = "ff7f50";
-    CSSColors["cornflowerblue"] = "6495ed";
-    CSSColors["cornsilk"] = "fff8dc";
-    CSSColors["crimson"] = "dc143c";
-    CSSColors["cyan"] = "00ffff";
-    CSSColors["darkblue"] = "00008b";
-    CSSColors["darkcyan"] = "008b8b";
-    CSSColors["darkgoldenrod"] = "b8860b";
-    CSSColors["darkgray"] = "a9a9a9";
-    CSSColors["darkgrey"] = "a9a9a9";
-    CSSColors["darkgreen"] = "006400";
-    CSSColors["darkkhaki"] = "bdb76b";
-    CSSColors["darkmagenta"] = "8b008b";
-    CSSColors["darkolivegreen"] = "556b2f";
-    CSSColors["darkorange"] = "ff8c00";
-    CSSColors["darkorchid"] = "9932cc";
-    CSSColors["darkred"] = "8b0000";
-    CSSColors["darksalmon"] = "e9967a";
-    CSSColors["darkseagreen"] = "8fbc8f";
-    CSSColors["darkslateblue"] = "483d8b";
-    CSSColors["darkslategray"] = "2f4f4f";
-    CSSColors["darkslategrey"] = "2f4f4f";
-    CSSColors["darkturquoise"] = "00ced1";
-    CSSColors["darkviolet"] = "9400d3";
-    CSSColors["deeppink"] = "ff1493";
-    CSSColors["deepskyblue"] = "00bfff";
-    CSSColors["dimgray"] = "696969";
-    CSSColors["dimgrey"] = "696969";
-    CSSColors["dodgerblue"] = "1e90ff";
-    CSSColors["firebrick"] = "b22222";
-    CSSColors["floralwhite"] = "fffaf0";
-    CSSColors["forestgreen"] = "228b22";
-    CSSColors["fuchsia"] = "ff00ff";
-    CSSColors["gainsboro"] = "dcdcdc";
-    CSSColors["ghostwhite"] = "f8f8ff";
-    CSSColors["gold"] = "ffd700";
-    CSSColors["goldenrod"] = "daa520";
-    CSSColors["gray"] = "808080";
-    CSSColors["grey"] = "808080";
-    CSSColors["green"] = "008000";
-    CSSColors["greenyellow"] = "adff2f";
-    CSSColors["honeydew"] = "f0fff0";
-    CSSColors["hotpink"] = "ff69b4";
-    CSSColors["indianred"] = "cd5c5c";
-    CSSColors["indigo"] = "4b0082";
-    CSSColors["ivory"] = "fffff0";
-    CSSColors["khaki"] = "f0e68c";
-    CSSColors["lavender"] = "e6e6fa";
-    CSSColors["lavenderblush"] = "fff0f5";
-    CSSColors["lawngreen"] = "7cfc00";
-    CSSColors["lemonchiffon"] = "fffacd";
-    CSSColors["lightblue"] = "add8e6";
-    CSSColors["lightcoral"] = "f08080";
-    CSSColors["lightcyan"] = "e0ffff";
-    CSSColors["lightgoldenrodyellow"] = "fafad2";
-    CSSColors["lightgray"] = "d3d3d3";
-    CSSColors["lightgrey"] = "d3d3d3";
-    CSSColors["lightgreen"] = "90ee90";
-    CSSColors["lightpink"] = "ffb6c1";
-    CSSColors["lightsalmon"] = "ffa07a";
-    CSSColors["lightseagreen"] = "20b2aa";
-    CSSColors["lightskyblue"] = "87cefa";
-    CSSColors["lightslategray"] = "778899";
-    CSSColors["lightslategrey"] = "778899";
-    CSSColors["lightsteelblue"] = "b0c4de";
-    CSSColors["lightyellow"] = "ffffe0";
-    CSSColors["lime"] = "00ff00";
-    CSSColors["limegreen"] = "32cd32";
-    CSSColors["linen"] = "faf0e6";
-    CSSColors["magenta"] = "ff00ff";
-    CSSColors["maroon"] = "800000";
-    CSSColors["mediumaquamarine"] = "66cdaa";
-    CSSColors["mediumblue"] = "0000cd";
-    CSSColors["mediumorchid"] = "ba55d3";
-    CSSColors["mediumpurple"] = "9370db";
-    CSSColors["mediumseagreen"] = "3cb371";
-    CSSColors["mediumslateblue"] = "7b68ee";
-    CSSColors["mediumspringgreen"] = "00fa9a";
-    CSSColors["mediumturquoise"] = "48d1cc";
-    CSSColors["mediumvioletred"] = "c71585";
-    CSSColors["midnightblue"] = "191970";
-    CSSColors["mintcream"] = "f5fffa";
-    CSSColors["mistyrose"] = "ffe4e1";
-    CSSColors["moccasin"] = "ffe4b5";
-    CSSColors["navajowhite"] = "ffdead";
-    CSSColors["navy"] = "000080";
-    CSSColors["oldlace"] = "fdf5e6";
-    CSSColors["olive"] = "808000";
-    CSSColors["olivedrab"] = "6b8e23";
-    CSSColors["orange"] = "ffa500";
-    CSSColors["orangered"] = "ff4500";
-    CSSColors["orchid"] = "da70d6";
-    CSSColors["palegoldenrod"] = "eee8aa";
-    CSSColors["palegreen"] = "98fb98";
-    CSSColors["paleturquoise"] = "afeeee";
-    CSSColors["palevioletred"] = "db7093";
-    CSSColors["papayawhip"] = "ffefd5";
-    CSSColors["peachpuff"] = "ffdab9";
-    CSSColors["peru"] = "cd853f";
-    CSSColors["pink"] = "ffc0cb";
-    CSSColors["plum"] = "dda0dd";
-    CSSColors["powderblue"] = "b0e0e6";
-    CSSColors["purple"] = "800080";
-    CSSColors["red"] = "ff0000";
-    CSSColors["rosybrown"] = "bc8f8f";
-    CSSColors["royalblue"] = "4169e1";
-    CSSColors["saddlebrown"] = "8b4513";
-    CSSColors["salmon"] = "fa8072";
-    CSSColors["sandybrown"] = "f4a460";
-    CSSColors["seagreen"] = "2e8b57";
-    CSSColors["seashell"] = "fff5ee";
-    CSSColors["sienna"] = "a0522d";
-    CSSColors["silver"] = "c0c0c0";
-    CSSColors["skyblue"] = "87ceeb";
-    CSSColors["slateblue"] = "6a5acd";
-    CSSColors["slategray"] = "708090";
-    CSSColors["slategrey"] = "708090";
-    CSSColors["snow"] = "fffafa";
-    CSSColors["springgreen"] = "00ff7f";
-    CSSColors["steelblue"] = "4682b4";
-    CSSColors["tan"] = "d2b48c";
-    CSSColors["teal"] = "008080";
-    CSSColors["thistle"] = "d8bfd8";
-    CSSColors["tomato"] = "ff6347";
-    CSSColors["turquoise"] = "40e0d0";
-    CSSColors["violet"] = "ee82ee";
-    CSSColors["wheat"] = "f5deb3";
-    CSSColors["white"] = "ffffff";
-    CSSColors["whitesmoke"] = "f5f5f5";
-    CSSColors["yellow"] = "ffff00";
-    CSSColors["yellowgreen"] = "9acd32";
-    CSSColors["transparent"] = "00000000";
-})(CSSColors || (CSSColors = {}));
+const CSSColors = new Map([
+    ["aliceblue", "f0f8ff"],
+    ["antiquewhite", "faebd7"],
+    ["aqua", "00ffff"],
+    ["aquamarine", "7fffd4"],
+    ["azure", "f0ffff"],
+    ["beige", "f5f5dc"],
+    ["bisque", "ffe4c4"],
+    ["black", "000000"],
+    ["blanchedalmond", "ffebcd"],
+    ["blue", "0000ff"],
+    ["blueviolet", "8a2be2"],
+    ["brown", "a52a2a"],
+    ["burlywood", "deb887"],
+    ["cadetblue", "5f9ea0"],
+    ["chartreuse", "7fff00"],
+    ["chocolate", "d2691e"],
+    ["coral", "ff7f50"],
+    ["cornflowerblue", "6495ed"],
+    ["cornsilk", "fff8dc"],
+    ["crimson", "dc143c"],
+    ["cyan", "00ffff"],
+    ["darkblue", "00008b"],
+    ["darkcyan", "008b8b"],
+    ["darkgoldenrod", "b8860b"],
+    ["darkgray", "a9a9a9"],
+    ["darkgrey", "a9a9a9"],
+    ["darkgreen", "006400"],
+    ["darkkhaki", "bdb76b"],
+    ["darkmagenta", "8b008b"],
+    ["darkolivegreen", "556b2f"],
+    ["darkorange", "ff8c00"],
+    ["darkorchid", "9932cc"],
+    ["darkred", "8b0000"],
+    ["darksalmon", "e9967a"],
+    ["darkseagreen", "8fbc8f"],
+    ["darkslateblue", "483d8b"],
+    ["darkslategray", "2f4f4f"],
+    ["darkslategrey", "2f4f4f"],
+    ["darkturquoise", "00ced1"],
+    ["darkviolet", "9400d3"],
+    ["deeppink", "ff1493"],
+    ["deepskyblue", "00bfff"],
+    ["dimgray", "696969"],
+    ["dimgrey", "696969"],
+    ["dodgerblue", "1e90ff"],
+    ["firebrick", "b22222"],
+    ["floralwhite", "fffaf0"],
+    ["forestgreen", "228b22"],
+    ["fuchsia", "ff00ff"],
+    ["gainsboro", "dcdcdc"],
+    ["ghostwhite", "f8f8ff"],
+    ["gold", "ffd700"],
+    ["goldenrod", "daa520"],
+    ["gray", "808080"],
+    ["grey", "808080"],
+    ["green", "008000"],
+    ["greenyellow", "adff2f"],
+    ["honeydew", "f0fff0"],
+    ["hotpink", "ff69b4"],
+    ["indianred", "cd5c5c"],
+    ["indigo", "4b0082"],
+    ["ivory", "fffff0"],
+    ["khaki", "f0e68c"],
+    ["lavender", "e6e6fa"],
+    ["lavenderblush", "fff0f5"],
+    ["lawngreen", "7cfc00"],
+    ["lemonchiffon", "fffacd"],
+    ["lightblue", "add8e6"],
+    ["lightcoral", "f08080"],
+    ["lightcyan", "e0ffff"],
+    ["lightgoldenrodyellow", "fafad2"],
+    ["lightgray", "d3d3d3"],
+    ["lightgrey", "d3d3d3"],
+    ["lightgreen", "90ee90"],
+    ["lightpink", "ffb6c1"],
+    ["lightsalmon", "ffa07a"],
+    ["lightseagreen", "20b2aa"],
+    ["lightskyblue", "87cefa"],
+    ["lightslategray", "778899"],
+    ["lightslategrey", "778899"],
+    ["lightsteelblue", "b0c4de"],
+    ["lightyellow", "ffffe0"],
+    ["lime", "00ff00"],
+    ["limegreen", "32cd32"],
+    ["linen", "faf0e6"],
+    ["magenta", "ff00ff"],
+    ["maroon", "800000"],
+    ["mediumaquamarine", "66cdaa"],
+    ["mediumblue", "0000cd"],
+    ["mediumorchid", "ba55d3"],
+    ["mediumpurple", "9370db"],
+    ["mediumseagreen", "3cb371"],
+    ["mediumslateblue", "7b68ee"],
+    ["mediumspringgreen", "00fa9a"],
+    ["mediumturquoise", "48d1cc"],
+    ["mediumvioletred", "c71585"],
+    ["midnightblue", "191970"],
+    ["mintcream", "f5fffa"],
+    ["mistyrose", "ffe4e1"],
+    ["moccasin", "ffe4b5"],
+    ["navajowhite", "ffdead"],
+    ["navy", "000080"],
+    ["oldlace", "fdf5e6"],
+    ["olive", "808000"],
+    ["olivedrab", "6b8e23"],
+    ["orange", "ffa500"],
+    ["orangered", "ff4500"],
+    ["orchid", "da70d6"],
+    ["palegoldenrod", "eee8aa"],
+    ["palegreen", "98fb98"],
+    ["paleturquoise", "afeeee"],
+    ["palevioletred", "db7093"],
+    ["papayawhip", "ffefd5"],
+    ["peachpuff", "ffdab9"],
+    ["peru", "cd853f"],
+    ["pink", "ffc0cb"],
+    ["plum", "dda0dd"],
+    ["powderblue", "b0e0e6"],
+    ["purple", "800080"],
+    ["red", "ff0000"],
+    ["rosybrown", "bc8f8f"],
+    ["royalblue", "4169e1"],
+    ["saddlebrown", "8b4513"],
+    ["salmon", "fa8072"],
+    ["sandybrown", "f4a460"],
+    ["seagreen", "2e8b57"],
+    ["seashell", "fff5ee"],
+    ["sienna", "a0522d"],
+    ["silver", "c0c0c0"],
+    ["skyblue", "87ceeb"],
+    ["slateblue", "6a5acd"],
+    ["slategray", "708090"],
+    ["slategrey", "708090"],
+    ["snow", "fffafa"],
+    ["springgreen", "00ff7f"],
+    ["steelblue", "4682b4"],
+    ["tan", "d2b48c"],
+    ["teal", "008080"],
+    ["thistle", "d8bfd8"],
+    ["tomato", "ff6347"],
+    ["turquoise", "40e0d0"],
+    ["violet", "ee82ee"],
+    ["wheat", "f5deb3"],
+    ["white", "ffffff"],
+    ["whitesmoke", "f5f5f5"],
+    ["yellow", "ffff00"],
+    ["yellowgreen", "9acd32"],
+    ["transparent", "00000000"],
+]);
 const getRGBColor = (color) => {
     if (color.startsWith("rgba")) {
         return RGBAToRGB(color);
@@ -174,11 +173,21 @@ const getRGBColor = (color) => {
         }
     }
     // Css Color
-    if (color in CSSColors) {
-        color = CSSColors[color];
+    if (CSSColors.has(color)) {
+        color = CSSColors.get(color);
     }
     return HEXToRGB(color);
 };
+const getAlpha = (color) => {
+    let alpha = 1;
+    if (color.startsWith("rgba") || color.startsWith("hsla")) {
+        const parts = color.split(",");
+        if (parts.length === 4) {
+            alpha = parseFloat(parts[3].replace(")", "").trim());
+        }
+    }
+    return alpha;
+};
 /**
  * Return an object with the properties for each of the main colors(red, green, blue)
  * @param {String} color Receives a color in the following format: "rgba(0, 0, 0, 1)
@@ -215,61 +224,67 @@ const RGBStringToRGBObject = (color) => {
 };
 const HSLToRGB = (color) => {
     // Formula taken from https://www.rapidtables.com/convert/color/hsl-to-rgb.html
-    const C = (1 - Math.abs((2 * color.l) - 1)) * color.s, X = C * (1 - Math.abs(((color.h / 60) % 2) - 1)), m = color.l - C / 2;
-    let tempColor;
-    switch (Math.round(color.h / 60)) {
-        // 0 ≤ H < 60
+    let saturation = color.s, lightness = color.l, red, green, blue;
+    if (saturation > 100) {
+        saturation = 1;
+    }
+    else if (saturation < 0) {
+        saturation = 0;
+    }
+    else {
+        saturation /= 100;
+    }
+    if (lightness > 100) {
+        lightness = 1;
+    }
+    else if (lightness < 0) {
+        lightness = 0;
+    }
+    else {
+        lightness /= 100;
+    }
+    const hue = ((color.h % 360) + 360) % 360, d = saturation * (1 - Math.abs(2 * lightness - 1)), m = 255 * (lightness - 0.5 * d), x = d * (1 - Math.abs(((hue / 60) % 2) - 1)), i = Math.floor(hue / 60), m255x = m + 255 * x, m255d = m + 255 * d;
+    switch (i) {
         case 0:
-            tempColor = {
-                r: C,
-                g: X,
-                b: 0,
-            };
+            red = m255d;
+            green = m255x;
+            blue = m;
             break;
-        // 60 ≤ H < 120
         case 1:
-            tempColor = {
-                r: X,
-                g: C,
-                b: 0,
-            };
+            red = m255x;
+            green = m255d;
+            blue = m;
             break;
-        // 120 ≤ H < 180
         case 2:
-            tempColor = {
-                r: 0,
-                g: C,
-                b: X,
-            };
+            red = m;
+            green = m255d;
+            blue = m255x;
             break;
-        // 180 ≤ H < 240
         case 3:
-            tempColor = {
-                r: 0,
-                g: X,
-                b: C,
-            };
+            red = m;
+            green = m255x;
+            blue = m255d;
             break;
-        // 240 ≤ H < 300
         case 4:
-            tempColor = {
-                r: X,
-                g: 0,
-                b: C,
-            };
+            red = m255x;
+            green = m;
+            blue = m255d;
+            break;
+        case 5:
+            red = m255d;
+            green = m;
+            blue = m255x;
             break;
-        // 300 ≤ H < 360
         default:
-            tempColor = {
-                r: C,
-                g: 0,
-                b: X,
-            };
+            red = 0;
+            green = 0;
+            blue = 0;
+            break;
     }
     return {
-        r: Math.floor((tempColor.r + m) * 255),
-        g: Math.floor((tempColor.g + m) * 255),
-        b: Math.floor((tempColor.b + m) * 255),
+        r: Math.round(red),
+        g: Math.round(green),
+        b: Math.round(blue),
     };
 };
 const HEXToRGB = (hex) => {
@@ -286,8 +301,8 @@ const HEXToRGB = (hex) => {
  * @param {Object} color Receives an object with the properties for each of the main colors(r, g, b)
  */
 const RGBtoHEX = (color) => {
-    const hexMap = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E"];
-    let hexValue = "#";
+    const hexMap = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f"];
+    let hexValue = "";
     let divisionNumber = color.r / 16;
     let remainder = color.r % 16;
     hexValue += String(hexMap[Math.floor(divisionNumber)]);
@@ -304,34 +319,36 @@ const RGBtoHEX = (color) => {
 };
 const RGBToHSL = (color) => {
     const R = color.r / 255, G = color.g / 255, B = color.b / 255, max = Math.max(R, G, B), min = Math.min(R, G, B), delta = max - min;
-    let h = 0, s;
-    // Hue calculation
-    if (delta === 0) {
+    let h = (max + min) / 2;
+    let s = (max + min) / 2;
+    let l = (max + min) / 2;
+    if (max === min) {
         h = 0;
-    }
-    else if (max === R) {
-        h = 60 * (((G - B) / delta) % 6);
-    }
-    else if (max === G) {
-        h = 60 * (((B - R) / delta) + 2);
-    }
-    else if (max === B) {
-        h = 60 * (((R - G) / delta) + 4);
-    }
-    // Lightness calculation
-    const l = (max + min) / 2;
-    // Saturation calculation
-    if (delta === 0) {
         s = 0;
     }
     else {
-        s = delta / (1 - Math.abs(2 * l - 1));
+        s = l > 0.5 ? delta / (2 - max - min) : delta / (max + min);
+        switch (max) {
+            case R:
+                h = (G - B) / delta + (G < B ? 6 : 0);
+                break;
+            case G:
+                h = (B - R) / delta + 2;
+                break;
+            case B:
+                h = (R - G) / delta + 4;
+                break;
+        }
+        h /= 6;
     }
+    h = Math.round(h * 360);
+    s = Math.round(s * 100);
+    l = Math.round(l * 100);
     return {
         h,
         s,
         l,
     };
 };
-export { getRGBColor, HSLToRGB, HEXToRGB, RGBToHSL, RGBStringToRGBObject, RGBtoHEX, };
+export { getRGBColor, getAlpha, HSLToRGB, HEXToRGB, RGBToHSL, RGBStringToRGBObject, RGBtoHEX, };
 //# sourceMappingURL=ColorConversion.js.map