@darajs/components 1.7.1 → 1.7.3

package/dist/umd/dara.components.umd.js

@@ -5901,7 +5901,7 @@
     };
     return _wrapNativeSuper$1(Class);
   }
-  var PolishedError$1 = /* @__PURE__ */ function(_Error) {
+  var PolishedError$2 = /* @__PURE__ */ function(_Error) {
     _inheritsLoose$2(PolishedError2, _Error);
     function PolishedError2(code2) {
       var _this;
@@ -5912,15 +5912,15 @@
     }
     return PolishedError2;
   }(/* @__PURE__ */ _wrapNativeSuper$1(Error));
-  function colorToInt$1(color2) {
+  function colorToInt$2(color2) {
     return Math.round(color2 * 255);
   }
-  function convertToInt$1(red, green, blue) {
-    return colorToInt$1(red) + "," + colorToInt$1(green) + "," + colorToInt$1(blue);
+  function convertToInt$2(red, green, blue) {
+    return colorToInt$2(red) + "," + colorToInt$2(green) + "," + colorToInt$2(blue);
   }
-  function hslToRgb$1(hue, saturation, lightness, convert2) {
+  function hslToRgb$2(hue, saturation, lightness, convert2) {
     if (convert2 === void 0) {
-      convert2 = convertToInt$1;
+      convert2 = convertToInt$2;
     }
     if (saturation === 0) {
       return convert2(lightness, lightness, lightness);
@@ -5956,7 +5956,7 @@
     var finalBlue = blue + lightnessModification;
     return convert2(finalRed, finalGreen, finalBlue);
   }
-  var namedColorMap$1 = {
+  var namedColorMap$2 = {
     aliceblue: "f0f8ff",
     antiquewhite: "faebd7",
     aqua: "00ffff",
@@ -6106,33 +6106,33 @@
     yellow: "ff0",
     yellowgreen: "9acd32"
   };
-  function nameToHex$1(color2) {
+  function nameToHex$2(color2) {
     if (typeof color2 !== "string")
       return color2;
     var normalizedColorName = color2.toLowerCase();
-    return namedColorMap$1[normalizedColorName] ? "#" + namedColorMap$1[normalizedColorName] : color2;
-  }
-  var hexRegex$1 = /^#[a-fA-F0-9]{6}$/;
-  var hexRgbaRegex$1 = /^#[a-fA-F0-9]{8}$/;
-  var reducedHexRegex$1 = /^#[a-fA-F0-9]{3}$/;
-  var reducedRgbaHexRegex$1 = /^#[a-fA-F0-9]{4}$/;
-  var rgbRegex$1 = /^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/i;
-  var rgbaRegex$1 = /^rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/i;
-  var hslRegex$1 = /^hsl\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*\)$/i;
-  var hslaRegex$1 = /^hsla\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/i;
-  function parseToRgb$1(color2) {
+    return namedColorMap$2[normalizedColorName] ? "#" + namedColorMap$2[normalizedColorName] : color2;
+  }
+  var hexRegex$2 = /^#[a-fA-F0-9]{6}$/;
+  var hexRgbaRegex$2 = /^#[a-fA-F0-9]{8}$/;
+  var reducedHexRegex$2 = /^#[a-fA-F0-9]{3}$/;
+  var reducedRgbaHexRegex$2 = /^#[a-fA-F0-9]{4}$/;
+  var rgbRegex$2 = /^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/i;
+  var rgbaRegex$2 = /^rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/i;
+  var hslRegex$2 = /^hsl\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*\)$/i;
+  var hslaRegex$2 = /^hsla\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/i;
+  function parseToRgb$2(color2) {
     if (typeof color2 !== "string") {
-      throw new PolishedError$1(3);
+      throw new PolishedError$2(3);
     }
-    var normalizedColor = nameToHex$1(color2);
-    if (normalizedColor.match(hexRegex$1)) {
+    var normalizedColor = nameToHex$2(color2);
+    if (normalizedColor.match(hexRegex$2)) {
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
         green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
         blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16)
       };
     }
-    if (normalizedColor.match(hexRgbaRegex$1)) {
+    if (normalizedColor.match(hexRgbaRegex$2)) {
       var alpha = parseFloat((parseInt("" + normalizedColor[7] + normalizedColor[8], 16) / 255).toFixed(2));
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
@@ -6141,14 +6141,14 @@
         alpha
       };
     }
-    if (normalizedColor.match(reducedHexRegex$1)) {
+    if (normalizedColor.match(reducedHexRegex$2)) {
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
         green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
         blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16)
       };
     }
-    if (normalizedColor.match(reducedRgbaHexRegex$1)) {
+    if (normalizedColor.match(reducedRgbaHexRegex$2)) {
       var _alpha = parseFloat((parseInt("" + normalizedColor[4] + normalizedColor[4], 16) / 255).toFixed(2));
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
@@ -6157,7 +6157,7 @@
         alpha: _alpha
       };
     }
-    var rgbMatched = rgbRegex$1.exec(normalizedColor);
+    var rgbMatched = rgbRegex$2.exec(normalizedColor);
     if (rgbMatched) {
       return {
         red: parseInt("" + rgbMatched[1], 10),
@@ -6165,7 +6165,7 @@
         blue: parseInt("" + rgbMatched[3], 10)
       };
     }
-    var rgbaMatched = rgbaRegex$1.exec(normalizedColor);
+    var rgbaMatched = rgbaRegex$2.exec(normalizedColor);
     if (rgbaMatched) {
       return {
         red: parseInt("" + rgbaMatched[1], 10),
@@ -6174,15 +6174,15 @@
         alpha: parseFloat("" + rgbaMatched[4])
       };
     }
-    var hslMatched = hslRegex$1.exec(normalizedColor);
+    var hslMatched = hslRegex$2.exec(normalizedColor);
     if (hslMatched) {
       var hue = parseInt("" + hslMatched[1], 10);
       var saturation = parseInt("" + hslMatched[2], 10) / 100;
       var lightness = parseInt("" + hslMatched[3], 10) / 100;
-      var rgbColorString = "rgb(" + hslToRgb$1(hue, saturation, lightness) + ")";
-      var hslRgbMatched = rgbRegex$1.exec(rgbColorString);
+      var rgbColorString = "rgb(" + hslToRgb$2(hue, saturation, lightness) + ")";
+      var hslRgbMatched = rgbRegex$2.exec(rgbColorString);
       if (!hslRgbMatched) {
-        throw new PolishedError$1(4, normalizedColor, rgbColorString);
+        throw new PolishedError$2(4, normalizedColor, rgbColorString);
       }
       return {
         red: parseInt("" + hslRgbMatched[1], 10),
@@ -6190,15 +6190,15 @@
         blue: parseInt("" + hslRgbMatched[3], 10)
       };
     }
-    var hslaMatched = hslaRegex$1.exec(normalizedColor);
+    var hslaMatched = hslaRegex$2.exec(normalizedColor);
     if (hslaMatched) {
       var _hue = parseInt("" + hslaMatched[1], 10);
       var _saturation = parseInt("" + hslaMatched[2], 10) / 100;
       var _lightness = parseInt("" + hslaMatched[3], 10) / 100;
-      var _rgbColorString = "rgb(" + hslToRgb$1(_hue, _saturation, _lightness) + ")";
-      var _hslRgbMatched = rgbRegex$1.exec(_rgbColorString);
+      var _rgbColorString = "rgb(" + hslToRgb$2(_hue, _saturation, _lightness) + ")";
+      var _hslRgbMatched = rgbRegex$2.exec(_rgbColorString);
       if (!_hslRgbMatched) {
-        throw new PolishedError$1(4, normalizedColor, _rgbColorString);
+        throw new PolishedError$2(4, normalizedColor, _rgbColorString);
       }
       return {
         red: parseInt("" + _hslRgbMatched[1], 10),
@@ -6207,60 +6207,60 @@
         alpha: parseFloat("" + hslaMatched[4])
       };
     }
-    throw new PolishedError$1(5);
+    throw new PolishedError$2(5);
   }
-  var reduceHexValue$2 = function reduceHexValue2(value) {
+  var reduceHexValue$3 = function reduceHexValue2(value) {
     if (value.length === 7 && value[1] === value[2] && value[3] === value[4] && value[5] === value[6]) {
       return "#" + value[1] + value[3] + value[5];
     }
     return value;
   };
-  function numberToHex$1(value) {
+  function numberToHex$2(value) {
     var hex2 = value.toString(16);
     return hex2.length === 1 ? "0" + hex2 : hex2;
   }
-  function rgb$2(value, green, blue) {
+  function rgb$3(value, green, blue) {
     if (typeof value === "number" && typeof green === "number" && typeof blue === "number") {
-      return reduceHexValue$2("#" + numberToHex$1(value) + numberToHex$1(green) + numberToHex$1(blue));
+      return reduceHexValue$3("#" + numberToHex$2(value) + numberToHex$2(green) + numberToHex$2(blue));
     } else if (typeof value === "object" && green === void 0 && blue === void 0) {
-      return reduceHexValue$2("#" + numberToHex$1(value.red) + numberToHex$1(value.green) + numberToHex$1(value.blue));
+      return reduceHexValue$3("#" + numberToHex$2(value.red) + numberToHex$2(value.green) + numberToHex$2(value.blue));
     }
-    throw new PolishedError$1(6);
+    throw new PolishedError$2(6);
   }
-  function rgba$3(firstValue, secondValue, thirdValue, fourthValue) {
+  function rgba$4(firstValue, secondValue, thirdValue, fourthValue) {
     if (typeof firstValue === "string" && typeof secondValue === "number") {
-      var rgbValue = parseToRgb$1(firstValue);
+      var rgbValue = parseToRgb$2(firstValue);
       return "rgba(" + rgbValue.red + "," + rgbValue.green + "," + rgbValue.blue + "," + secondValue + ")";
     } else if (typeof firstValue === "number" && typeof secondValue === "number" && typeof thirdValue === "number" && typeof fourthValue === "number") {
-      return fourthValue >= 1 ? rgb$2(firstValue, secondValue, thirdValue) : "rgba(" + firstValue + "," + secondValue + "," + thirdValue + "," + fourthValue + ")";
+      return fourthValue >= 1 ? rgb$3(firstValue, secondValue, thirdValue) : "rgba(" + firstValue + "," + secondValue + "," + thirdValue + "," + fourthValue + ")";
     } else if (typeof firstValue === "object" && secondValue === void 0 && thirdValue === void 0 && fourthValue === void 0) {
-      return firstValue.alpha >= 1 ? rgb$2(firstValue.red, firstValue.green, firstValue.blue) : "rgba(" + firstValue.red + "," + firstValue.green + "," + firstValue.blue + "," + firstValue.alpha + ")";
+      return firstValue.alpha >= 1 ? rgb$3(firstValue.red, firstValue.green, firstValue.blue) : "rgba(" + firstValue.red + "," + firstValue.green + "," + firstValue.blue + "," + firstValue.alpha + ")";
     }
-    throw new PolishedError$1(7);
+    throw new PolishedError$2(7);
   }
-  function curried$1(f2, length, acc) {
+  function curried$2(f2, length, acc) {
     return function fn2() {
       var combined = acc.concat(Array.prototype.slice.call(arguments));
-      return combined.length >= length ? f2.apply(this, combined) : curried$1(f2, length, combined);
+      return combined.length >= length ? f2.apply(this, combined) : curried$2(f2, length, combined);
     };
   }
-  function curry$1(f2) {
-    return curried$1(f2, f2.length, []);
+  function curry$2(f2) {
+    return curried$2(f2, f2.length, []);
   }
-  function guard$1(lowerBoundary, upperBoundary, value) {
+  function guard$2(lowerBoundary, upperBoundary, value) {
     return Math.max(lowerBoundary, Math.min(upperBoundary, value));
   }
-  function transparentize$1(amount, color2) {
+  function transparentize$2(amount, color2) {
     if (color2 === "transparent")
       return color2;
-    var parsedColor = parseToRgb$1(color2);
+    var parsedColor = parseToRgb$2(color2);
     var alpha = typeof parsedColor.alpha === "number" ? parsedColor.alpha : 1;
     var colorWithAlpha = _extends$3({}, parsedColor, {
-      alpha: guard$1(0, 1, (alpha * 100 - parseFloat(amount) * 100) / 100)
+      alpha: guard$2(0, 1, (alpha * 100 - parseFloat(amount) * 100) / 100)
     });
-    return rgba$3(colorWithAlpha);
+    return rgba$4(colorWithAlpha);
   }
-  var curriedTransparentize$2 = /* @__PURE__ */ curry$1(transparentize$1);
+  var curriedTransparentize$2 = /* @__PURE__ */ curry$2(transparentize$2);
   const Wrapper$c = styled__default.default.div`
     display: flex;
     gap: 1rem;
@@ -31681,6 +31681,9 @@
   function UploadDropzone$1(props) {
     var _a3;
     React.useEffect(() => {
+      if (!props.enablePaste) {
+        return;
+      }
       const handlePaste = (ev) => {
         const blob = new Blob([ev.clipboardData.getData("Text")], { type: "text/plain" });
         const file = new File([blob], "pasted_data", { type: "text/plain" });
@@ -38710,7 +38713,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     };
     return _wrapNativeSuper(Class);
   }
-  var PolishedError = /* @__PURE__ */ function(_Error) {
+  var PolishedError$1 = /* @__PURE__ */ function(_Error) {
     _inheritsLoose(PolishedError2, _Error);
     function PolishedError2(code2) {
       var _this;
@@ -38721,15 +38724,15 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     }
     return PolishedError2;
   }(/* @__PURE__ */ _wrapNativeSuper(Error));
-  function colorToInt(color2) {
+  function colorToInt$1(color2) {
     return Math.round(color2 * 255);
   }
-  function convertToInt(red, green, blue) {
-    return colorToInt(red) + "," + colorToInt(green) + "," + colorToInt(blue);
+  function convertToInt$1(red, green, blue) {
+    return colorToInt$1(red) + "," + colorToInt$1(green) + "," + colorToInt$1(blue);
   }
-  function hslToRgb(hue, saturation, lightness, convert2) {
+  function hslToRgb$1(hue, saturation, lightness, convert2) {
     if (convert2 === void 0) {
-      convert2 = convertToInt;
+      convert2 = convertToInt$1;
     }
     if (saturation === 0) {
       return convert2(lightness, lightness, lightness);
@@ -38765,7 +38768,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     var finalBlue = blue + lightnessModification;
     return convert2(finalRed, finalGreen, finalBlue);
   }
-  var namedColorMap = {
+  var namedColorMap$1 = {
     aliceblue: "f0f8ff",
     antiquewhite: "faebd7",
     aqua: "00ffff",
@@ -38915,33 +38918,33 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     yellow: "ff0",
     yellowgreen: "9acd32"
   };
-  function nameToHex(color2) {
+  function nameToHex$1(color2) {
     if (typeof color2 !== "string")
       return color2;
     var normalizedColorName = color2.toLowerCase();
-    return namedColorMap[normalizedColorName] ? "#" + namedColorMap[normalizedColorName] : color2;
+    return namedColorMap$1[normalizedColorName] ? "#" + namedColorMap$1[normalizedColorName] : color2;
   }
-  var hexRegex = /^#[a-fA-F0-9]{6}$/;
-  var hexRgbaRegex = /^#[a-fA-F0-9]{8}$/;
-  var reducedHexRegex = /^#[a-fA-F0-9]{3}$/;
-  var reducedRgbaHexRegex = /^#[a-fA-F0-9]{4}$/;
-  var rgbRegex = /^rgb\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*\)$/i;
-  var rgbaRegex = /^rgb(?:a)?\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
-  var hslRegex = /^hsl\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*\)$/i;
-  var hslaRegex = /^hsl(?:a)?\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
-  function parseToRgb(color2) {
+  var hexRegex$1 = /^#[a-fA-F0-9]{6}$/;
+  var hexRgbaRegex$1 = /^#[a-fA-F0-9]{8}$/;
+  var reducedHexRegex$1 = /^#[a-fA-F0-9]{3}$/;
+  var reducedRgbaHexRegex$1 = /^#[a-fA-F0-9]{4}$/;
+  var rgbRegex$1 = /^rgb\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*\)$/i;
+  var rgbaRegex$1 = /^rgb(?:a)?\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
+  var hslRegex$1 = /^hsl\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*\)$/i;
+  var hslaRegex$1 = /^hsl(?:a)?\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
+  function parseToRgb$1(color2) {
     if (typeof color2 !== "string") {
-      throw new PolishedError(3);
+      throw new PolishedError$1(3);
     }
-    var normalizedColor = nameToHex(color2);
-    if (normalizedColor.match(hexRegex)) {
+    var normalizedColor = nameToHex$1(color2);
+    if (normalizedColor.match(hexRegex$1)) {
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
         green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
         blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16)
       };
     }
-    if (normalizedColor.match(hexRgbaRegex)) {
+    if (normalizedColor.match(hexRgbaRegex$1)) {
       var alpha = parseFloat((parseInt("" + normalizedColor[7] + normalizedColor[8], 16) / 255).toFixed(2));
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
@@ -38950,14 +38953,14 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         alpha
       };
     }
-    if (normalizedColor.match(reducedHexRegex)) {
+    if (normalizedColor.match(reducedHexRegex$1)) {
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
         green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
         blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16)
       };
     }
-    if (normalizedColor.match(reducedRgbaHexRegex)) {
+    if (normalizedColor.match(reducedRgbaHexRegex$1)) {
       var _alpha = parseFloat((parseInt("" + normalizedColor[4] + normalizedColor[4], 16) / 255).toFixed(2));
       return {
         red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
@@ -38966,7 +38969,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         alpha: _alpha
       };
     }
-    var rgbMatched = rgbRegex.exec(normalizedColor);
+    var rgbMatched = rgbRegex$1.exec(normalizedColor);
     if (rgbMatched) {
       return {
         red: parseInt("" + rgbMatched[1], 10),
@@ -38974,7 +38977,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         blue: parseInt("" + rgbMatched[3], 10)
       };
     }
-    var rgbaMatched = rgbaRegex.exec(normalizedColor.substring(0, 50));
+    var rgbaMatched = rgbaRegex$1.exec(normalizedColor.substring(0, 50));
     if (rgbaMatched) {
       return {
         red: parseInt("" + rgbaMatched[1], 10),
@@ -38983,15 +38986,15 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         alpha: parseFloat("" + rgbaMatched[4]) > 1 ? parseFloat("" + rgbaMatched[4]) / 100 : parseFloat("" + rgbaMatched[4])
       };
     }
-    var hslMatched = hslRegex.exec(normalizedColor);
+    var hslMatched = hslRegex$1.exec(normalizedColor);
     if (hslMatched) {
       var hue = parseInt("" + hslMatched[1], 10);
       var saturation = parseInt("" + hslMatched[2], 10) / 100;
       var lightness = parseInt("" + hslMatched[3], 10) / 100;
-      var rgbColorString = "rgb(" + hslToRgb(hue, saturation, lightness) + ")";
-      var hslRgbMatched = rgbRegex.exec(rgbColorString);
+      var rgbColorString = "rgb(" + hslToRgb$1(hue, saturation, lightness) + ")";
+      var hslRgbMatched = rgbRegex$1.exec(rgbColorString);
       if (!hslRgbMatched) {
-        throw new PolishedError(4, normalizedColor, rgbColorString);
+        throw new PolishedError$1(4, normalizedColor, rgbColorString);
       }
       return {
         red: parseInt("" + hslRgbMatched[1], 10),
@@ -38999,15 +39002,15 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         blue: parseInt("" + hslRgbMatched[3], 10)
       };
     }
-    var hslaMatched = hslaRegex.exec(normalizedColor.substring(0, 50));
+    var hslaMatched = hslaRegex$1.exec(normalizedColor.substring(0, 50));
     if (hslaMatched) {
       var _hue = parseInt("" + hslaMatched[1], 10);
       var _saturation = parseInt("" + hslaMatched[2], 10) / 100;
       var _lightness = parseInt("" + hslaMatched[3], 10) / 100;
-      var _rgbColorString = "rgb(" + hslToRgb(_hue, _saturation, _lightness) + ")";
-      var _hslRgbMatched = rgbRegex.exec(_rgbColorString);
+      var _rgbColorString = "rgb(" + hslToRgb$1(_hue, _saturation, _lightness) + ")";
+      var _hslRgbMatched = rgbRegex$1.exec(_rgbColorString);
       if (!_hslRgbMatched) {
-        throw new PolishedError(4, normalizedColor, _rgbColorString);
+        throw new PolishedError$1(4, normalizedColor, _rgbColorString);
       }
       return {
         red: parseInt("" + _hslRgbMatched[1], 10),
@@ -39016,92 +39019,61 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         alpha: parseFloat("" + hslaMatched[4]) > 1 ? parseFloat("" + hslaMatched[4]) / 100 : parseFloat("" + hslaMatched[4])
       };
     }
-    throw new PolishedError(5);
+    throw new PolishedError$1(5);
   }
-  var reduceHexValue = function reduceHexValue2(value) {
+  var reduceHexValue$2 = function reduceHexValue2(value) {
     if (value.length === 7 && value[1] === value[2] && value[3] === value[4] && value[5] === value[6]) {
       return "#" + value[1] + value[3] + value[5];
     }
     return value;
   };
-  var reduceHexValue$1 = reduceHexValue;
-  function numberToHex(value) {
+  var reduceHexValue$1$1 = reduceHexValue$2;
+  function numberToHex$1(value) {
     var hex2 = value.toString(16);
     return hex2.length === 1 ? "0" + hex2 : hex2;
   }
-  function rgb$1(value, green, blue) {
+  function rgb$2(value, green, blue) {
     if (typeof value === "number" && typeof green === "number" && typeof blue === "number") {
-      return reduceHexValue$1("#" + numberToHex(value) + numberToHex(green) + numberToHex(blue));
+      return reduceHexValue$1$1("#" + numberToHex$1(value) + numberToHex$1(green) + numberToHex$1(blue));
     } else if (typeof value === "object" && green === void 0 && blue === void 0) {
-      return reduceHexValue$1("#" + numberToHex(value.red) + numberToHex(value.green) + numberToHex(value.blue));
+      return reduceHexValue$1$1("#" + numberToHex$1(value.red) + numberToHex$1(value.green) + numberToHex$1(value.blue));
     }
-    throw new PolishedError(6);
+    throw new PolishedError$1(6);
   }
-  function rgba$2(firstValue, secondValue, thirdValue, fourthValue) {
+  function rgba$3(firstValue, secondValue, thirdValue, fourthValue) {
     if (typeof firstValue === "string" && typeof secondValue === "number") {
-      var rgbValue = parseToRgb(firstValue);
+      var rgbValue = parseToRgb$1(firstValue);
       return "rgba(" + rgbValue.red + "," + rgbValue.green + "," + rgbValue.blue + "," + secondValue + ")";
     } else if (typeof firstValue === "number" && typeof secondValue === "number" && typeof thirdValue === "number" && typeof fourthValue === "number") {
-      return fourthValue >= 1 ? rgb$1(firstValue, secondValue, thirdValue) : "rgba(" + firstValue + "," + secondValue + "," + thirdValue + "," + fourthValue + ")";
+      return fourthValue >= 1 ? rgb$2(firstValue, secondValue, thirdValue) : "rgba(" + firstValue + "," + secondValue + "," + thirdValue + "," + fourthValue + ")";
     } else if (typeof firstValue === "object" && secondValue === void 0 && thirdValue === void 0 && fourthValue === void 0) {
-      return firstValue.alpha >= 1 ? rgb$1(firstValue.red, firstValue.green, firstValue.blue) : "rgba(" + firstValue.red + "," + firstValue.green + "," + firstValue.blue + "," + firstValue.alpha + ")";
+      return firstValue.alpha >= 1 ? rgb$2(firstValue.red, firstValue.green, firstValue.blue) : "rgba(" + firstValue.red + "," + firstValue.green + "," + firstValue.blue + "," + firstValue.alpha + ")";
     }
-    throw new PolishedError(7);
+    throw new PolishedError$1(7);
   }
-  function curried(f2, length, acc) {
+  function curried$1(f2, length, acc) {
     return function fn2() {
       var combined = acc.concat(Array.prototype.slice.call(arguments));
-      return combined.length >= length ? f2.apply(this, combined) : curried(f2, length, combined);
+      return combined.length >= length ? f2.apply(this, combined) : curried$1(f2, length, combined);
     };
   }
-  function curry(f2) {
-    return curried(f2, f2.length, []);
+  function curry$1(f2) {
+    return curried$1(f2, f2.length, []);
   }
-  function guard(lowerBoundary, upperBoundary, value) {
+  function guard$1(lowerBoundary, upperBoundary, value) {
     return Math.max(lowerBoundary, Math.min(upperBoundary, value));
   }
-  function mix(weight, color2, otherColor) {
-    if (color2 === "transparent")
-      return otherColor;
-    if (otherColor === "transparent")
-      return color2;
-    if (weight === 0)
-      return otherColor;
-    var parsedColor1 = parseToRgb(color2);
-    var color1 = _extends$1({}, parsedColor1, {
-      alpha: typeof parsedColor1.alpha === "number" ? parsedColor1.alpha : 1
-    });
-    var parsedColor2 = parseToRgb(otherColor);
-    var color22 = _extends$1({}, parsedColor2, {
-      alpha: typeof parsedColor2.alpha === "number" ? parsedColor2.alpha : 1
-    });
-    var alphaDelta = color1.alpha - color22.alpha;
-    var x2 = parseFloat(weight) * 2 - 1;
-    var y2 = x2 * alphaDelta === -1 ? x2 : x2 + alphaDelta;
-    var z2 = 1 + x2 * alphaDelta;
-    var weight1 = (y2 / z2 + 1) / 2;
-    var weight2 = 1 - weight1;
-    var mixedColor = {
-      red: Math.floor(color1.red * weight1 + color22.red * weight2),
-      green: Math.floor(color1.green * weight1 + color22.green * weight2),
-      blue: Math.floor(color1.blue * weight1 + color22.blue * weight2),
-      alpha: color1.alpha * parseFloat(weight) + color22.alpha * (1 - parseFloat(weight))
-    };
-    return rgba$2(mixedColor);
-  }
-  var curriedMix = /* @__PURE__ */ curry(mix);
-  var mix$1 = curriedMix;
-  function transparentize(amount, color2) {
+  function transparentize$1(amount, color2) {
     if (color2 === "transparent")
       return color2;
-    var parsedColor = parseToRgb(color2);
+    var parsedColor = parseToRgb$1(color2);
     var alpha = typeof parsedColor.alpha === "number" ? parsedColor.alpha : 1;
     var colorWithAlpha = _extends$1({}, parsedColor, {
-      alpha: guard(0, 1, +(alpha * 100 - parseFloat(amount) * 100).toFixed(2) / 100)
+      alpha: guard$1(0, 1, +(alpha * 100 - parseFloat(amount) * 100).toFixed(2) / 100)
     });
-    return rgba$2(colorWithAlpha);
+    return rgba$3(colorWithAlpha);
   }
-  var curriedTransparentize = /* @__PURE__ */ curry(transparentize);
+  var curriedTransparentize = /* @__PURE__ */ curry$1(transparentize$1);
   var curriedTransparentize$1 = curriedTransparentize;
   const CardDiv = core$2.injectCss(styled__default.default.div`
     display: flex;
@@ -42746,7 +42718,16 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     if (currentStatus === status.LOADING) {
       return /* @__PURE__ */ React__default.default.createElement(core$2.DefaultFallback, null);
     }
-    return /* @__PURE__ */ React__default.default.createElement(StyledDropzone, { $rawCss: css2, accept: props.accept, onDrop, style: style2 });
+    return /* @__PURE__ */ React__default.default.createElement(
+      StyledDropzone,
+      {
+        $rawCss: css2,
+        accept: props.accept,
+        enablePaste: props.enable_paste,
+        onDrop,
+        style: style2
+      }
+    );
   }
   const GridComponent = styled__default.default.div`
     display: flex;
@@ -274906,11 +274887,11 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
                   return this._a == 1 ? "hsv(" + h2 + ", " + s2 + "%, " + v2 + "%)" : "hsva(" + h2 + ", " + s2 + "%, " + v2 + "%, " + this._roundA + ")";
                 },
                 toHsl: function() {
-                  var hsl2 = rgbToHsl(this._r, this._g, this._b);
+                  var hsl2 = rgbToHsl2(this._r, this._g, this._b);
                   return { h: hsl2.h * 360, s: hsl2.s, l: hsl2.l, a: this._a };
                 },
                 toHslString: function() {
-                  var hsl2 = rgbToHsl(this._r, this._g, this._b);
+                  var hsl2 = rgbToHsl2(this._r, this._g, this._b);
                   var h2 = mathRound(hsl2.h * 360), s2 = mathRound(hsl2.s * 100), l2 = mathRound(hsl2.l * 100);
                   return this._a == 1 ? "hsl(" + h2 + ", " + s2 + "%, " + l2 + "%)" : "hsla(" + h2 + ", " + s2 + "%, " + l2 + "%, " + this._roundA + ")";
                 },
@@ -275010,19 +274991,19 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
                   return this;
                 },
                 lighten: function() {
-                  return this._applyModification(lighten, arguments);
+                  return this._applyModification(lighten2, arguments);
                 },
                 brighten: function() {
                   return this._applyModification(brighten, arguments);
                 },
                 darken: function() {
-                  return this._applyModification(darken, arguments);
+                  return this._applyModification(darken2, arguments);
                 },
                 desaturate: function() {
-                  return this._applyModification(desaturate, arguments);
+                  return this._applyModification(desaturate2, arguments);
                 },
                 saturate: function() {
-                  return this._applyModification(saturate, arguments);
+                  return this._applyModification(saturate2, arguments);
                 },
                 greyscale: function() {
                   return this._applyModification(greyscale, arguments);
@@ -275118,7 +275099,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
                   b: bound01(b2, 255) * 255
                 };
               }
-              function rgbToHsl(r2, g2, b2) {
+              function rgbToHsl2(r2, g2, b2) {
                 r2 = bound01(r2, 255);
                 g2 = bound01(g2, 255);
                 b2 = bound01(b2, 255);
@@ -275251,14 +275232,14 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
                   b: mathRandom()
                 });
               };
-              function desaturate(color2, amount) {
+              function desaturate2(color2, amount) {
                 amount = amount === 0 ? 0 : amount || 10;
                 var hsl2 = tinycolor(color2).toHsl();
                 hsl2.s -= amount / 100;
                 hsl2.s = clamp01(hsl2.s);
                 return tinycolor(hsl2);
               }
-              function saturate(color2, amount) {
+              function saturate2(color2, amount) {
                 amount = amount === 0 ? 0 : amount || 10;
                 var hsl2 = tinycolor(color2).toHsl();
                 hsl2.s += amount / 100;
@@ -275268,7 +275249,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
               function greyscale(color2) {
                 return tinycolor(color2).desaturate(100);
               }
-              function lighten(color2, amount) {
+              function lighten2(color2, amount) {
                 amount = amount === 0 ? 0 : amount || 10;
                 var hsl2 = tinycolor(color2).toHsl();
                 hsl2.l += amount / 100;
@@ -275283,7 +275264,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
                 rgb2.b = mathMax(0, mathMin(255, rgb2.b - mathRound(255 * -(amount / 100))));
                 return tinycolor(rgb2);
               }
-              function darken(color2, amount) {
+              function darken2(color2, amount) {
                 amount = amount === 0 ? 0 : amount || 10;
                 var hsl2 = tinycolor(color2).toHsl();
                 hsl2.l -= amount / 100;
@@ -285639,12 +285620,12 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
   function color(format2) {
     var m2, l2;
     format2 = (format2 + "").trim().toLowerCase();
-    return (m2 = reHex.exec(format2)) ? (l2 = m2[1].length, m2 = parseInt(m2[1], 16), l2 === 6 ? rgbn(m2) : l2 === 3 ? new Rgb(m2 >> 8 & 15 | m2 >> 4 & 240, m2 >> 4 & 15 | m2 & 240, (m2 & 15) << 4 | m2 & 15, 1) : l2 === 8 ? rgba$1(m2 >> 24 & 255, m2 >> 16 & 255, m2 >> 8 & 255, (m2 & 255) / 255) : l2 === 4 ? rgba$1(m2 >> 12 & 15 | m2 >> 8 & 240, m2 >> 8 & 15 | m2 >> 4 & 240, m2 >> 4 & 15 | m2 & 240, ((m2 & 15) << 4 | m2 & 15) / 255) : null) : (m2 = reRgbInteger.exec(format2)) ? new Rgb(m2[1], m2[2], m2[3], 1) : (m2 = reRgbPercent.exec(format2)) ? new Rgb(m2[1] * 255 / 100, m2[2] * 255 / 100, m2[3] * 255 / 100, 1) : (m2 = reRgbaInteger.exec(format2)) ? rgba$1(m2[1], m2[2], m2[3], m2[4]) : (m2 = reRgbaPercent.exec(format2)) ? rgba$1(m2[1] * 255 / 100, m2[2] * 255 / 100, m2[3] * 255 / 100, m2[4]) : (m2 = reHslPercent.exec(format2)) ? hsla$1(m2[1], m2[2] / 100, m2[3] / 100, 1) : (m2 = reHslaPercent.exec(format2)) ? hsla$1(m2[1], m2[2] / 100, m2[3] / 100, m2[4]) : named.hasOwnProperty(format2) ? rgbn(named[format2]) : format2 === "transparent" ? new Rgb(NaN, NaN, NaN, 0) : null;
+    return (m2 = reHex.exec(format2)) ? (l2 = m2[1].length, m2 = parseInt(m2[1], 16), l2 === 6 ? rgbn(m2) : l2 === 3 ? new Rgb(m2 >> 8 & 15 | m2 >> 4 & 240, m2 >> 4 & 15 | m2 & 240, (m2 & 15) << 4 | m2 & 15, 1) : l2 === 8 ? rgba$2(m2 >> 24 & 255, m2 >> 16 & 255, m2 >> 8 & 255, (m2 & 255) / 255) : l2 === 4 ? rgba$2(m2 >> 12 & 15 | m2 >> 8 & 240, m2 >> 8 & 15 | m2 >> 4 & 240, m2 >> 4 & 15 | m2 & 240, ((m2 & 15) << 4 | m2 & 15) / 255) : null) : (m2 = reRgbInteger.exec(format2)) ? new Rgb(m2[1], m2[2], m2[3], 1) : (m2 = reRgbPercent.exec(format2)) ? new Rgb(m2[1] * 255 / 100, m2[2] * 255 / 100, m2[3] * 255 / 100, 1) : (m2 = reRgbaInteger.exec(format2)) ? rgba$2(m2[1], m2[2], m2[3], m2[4]) : (m2 = reRgbaPercent.exec(format2)) ? rgba$2(m2[1] * 255 / 100, m2[2] * 255 / 100, m2[3] * 255 / 100, m2[4]) : (m2 = reHslPercent.exec(format2)) ? hsla$2(m2[1], m2[2] / 100, m2[3] / 100, 1) : (m2 = reHslaPercent.exec(format2)) ? hsla$2(m2[1], m2[2] / 100, m2[3] / 100, m2[4]) : named.hasOwnProperty(format2) ? rgbn(named[format2]) : format2 === "transparent" ? new Rgb(NaN, NaN, NaN, 0) : null;
   }
   function rgbn(n2) {
     return new Rgb(n2 >> 16 & 255, n2 >> 8 & 255, n2 & 255, 1);
   }
-  function rgba$1(r2, g2, b2, a2) {
+  function rgba$2(r2, g2, b2, a2) {
     if (a2 <= 0)
       r2 = g2 = b2 = NaN;
     return new Rgb(r2, g2, b2, a2);
@@ -285657,7 +285638,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     o2 = o2.rgb();
     return new Rgb(o2.r, o2.g, o2.b, o2.opacity);
   }
-  function rgb(r2, g2, b2, opacity) {
+  function rgb$1(r2, g2, b2, opacity) {
     return arguments.length === 1 ? rgbConvert(r2) : new Rgb(r2, g2, b2, opacity == null ? 1 : opacity);
   }
   function Rgb(r2, g2, b2, opacity) {
@@ -285666,7 +285647,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     this.b = +b2;
     this.opacity = +opacity;
   }
-  define$6(Rgb, rgb, extend$2(Color$1, {
+  define$6(Rgb, rgb$1, extend$2(Color$1, {
     brighter: function(k2) {
       k2 = k2 == null ? brighter : Math.pow(brighter, k2);
       return new Rgb(this.r * k2, this.g * k2, this.b * k2, this.opacity);
@@ -285698,7 +285679,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     value = Math.max(0, Math.min(255, Math.round(value) || 0));
     return (value < 16 ? "0" : "") + value.toString(16);
   }
-  function hsla$1(h2, s2, l2, a2) {
+  function hsla$2(h2, s2, l2, a2) {
     if (a2 <= 0)
       h2 = s2 = l2 = NaN;
     else if (l2 <= 0 || l2 >= 1)
@@ -285732,7 +285713,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     }
     return new Hsl(h2, s2, l2, o2.opacity);
   }
-  function hsl(h2, s2, l2, opacity) {
+  function hsl$1(h2, s2, l2, opacity) {
     return arguments.length === 1 ? hslConvert(h2) : new Hsl(h2, s2, l2, opacity == null ? 1 : opacity);
   }
   function Hsl(h2, s2, l2, opacity) {
@@ -285741,7 +285722,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     this.l = +l2;
     this.opacity = +opacity;
   }
-  define$6(Hsl, hsl, extend$2(Color$1, {
+  define$6(Hsl, hsl$1, extend$2(Color$1, {
     brighter: function(k2) {
       k2 = k2 == null ? brighter : Math.pow(brighter, k2);
       return new Hsl(this.h, this.s, this.l * k2, this.opacity);
@@ -285793,8 +285774,8 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
   }
   const interpolateRgb = function rgbGamma(y2) {
     var color2 = gamma(y2);
-    function rgb$12(start2, end2) {
-      var r2 = color2((start2 = rgb(start2)).r, (end2 = rgb(end2)).r), g2 = color2(start2.g, end2.g), b2 = color2(start2.b, end2.b), opacity = nogamma(start2.opacity, end2.opacity);
+    function rgb2(start2, end2) {
+      var r2 = color2((start2 = rgb$1(start2)).r, (end2 = rgb$1(end2)).r), g2 = color2(start2.g, end2.g), b2 = color2(start2.b, end2.b), opacity = nogamma(start2.opacity, end2.opacity);
       return function(t2) {
         start2.r = r2(t2);
         start2.g = g2(t2);
@@ -285803,8 +285784,8 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         return start2 + "";
       };
     }
-    rgb$12.gamma = rgbGamma;
-    return rgb$12;
+    rgb2.gamma = rgbGamma;
+    return rgb2;
   }(1);
   function interpolateNumber(a2, b2) {
     return a2 = +a2, b2 = +b2, function(t2) {
@@ -306461,6 +306442,595 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     };
     return AnonymousSubject2;
   }(Subject);
+  var PolishedError = /* @__PURE__ */ function(_Error) {
+    _inheritsLoose$2(PolishedError2, _Error);
+    function PolishedError2(code2) {
+      var _this;
+      {
+        _this = _Error.call(this, "An error occurred. See https://github.com/styled-components/polished/blob/main/src/internalHelpers/errors.md#" + code2 + " for more information.") || this;
+      }
+      return _assertThisInitialized$3(_this);
+    }
+    return PolishedError2;
+  }(/* @__PURE__ */ _wrapNativeSuper$1(Error));
+  function colorToInt(color2) {
+    return Math.round(color2 * 255);
+  }
+  function convertToInt(red, green, blue) {
+    return colorToInt(red) + "," + colorToInt(green) + "," + colorToInt(blue);
+  }
+  function hslToRgb(hue, saturation, lightness, convert2) {
+    if (convert2 === void 0) {
+      convert2 = convertToInt;
+    }
+    if (saturation === 0) {
+      return convert2(lightness, lightness, lightness);
+    }
+    var huePrime = (hue % 360 + 360) % 360 / 60;
+    var chroma = (1 - Math.abs(2 * lightness - 1)) * saturation;
+    var secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));
+    var red = 0;
+    var green = 0;
+    var blue = 0;
+    if (huePrime >= 0 && huePrime < 1) {
+      red = chroma;
+      green = secondComponent;
+    } else if (huePrime >= 1 && huePrime < 2) {
+      red = secondComponent;
+      green = chroma;
+    } else if (huePrime >= 2 && huePrime < 3) {
+      green = chroma;
+      blue = secondComponent;
+    } else if (huePrime >= 3 && huePrime < 4) {
+      green = secondComponent;
+      blue = chroma;
+    } else if (huePrime >= 4 && huePrime < 5) {
+      red = secondComponent;
+      blue = chroma;
+    } else if (huePrime >= 5 && huePrime < 6) {
+      red = chroma;
+      blue = secondComponent;
+    }
+    var lightnessModification = lightness - chroma / 2;
+    var finalRed = red + lightnessModification;
+    var finalGreen = green + lightnessModification;
+    var finalBlue = blue + lightnessModification;
+    return convert2(finalRed, finalGreen, finalBlue);
+  }
+  var namedColorMap = {
+    aliceblue: "f0f8ff",
+    antiquewhite: "faebd7",
+    aqua: "00ffff",
+    aquamarine: "7fffd4",
+    azure: "f0ffff",
+    beige: "f5f5dc",
+    bisque: "ffe4c4",
+    black: "000",
+    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",
+    darkgreen: "006400",
+    darkgrey: "a9a9a9",
+    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",
+    green: "008000",
+    greenyellow: "adff2f",
+    grey: "808080",
+    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",
+    lightgreen: "90ee90",
+    lightgrey: "d3d3d3",
+    lightpink: "ffb6c1",
+    lightsalmon: "ffa07a",
+    lightseagreen: "20b2aa",
+    lightskyblue: "87cefa",
+    lightslategray: "789",
+    lightslategrey: "789",
+    lightsteelblue: "b0c4de",
+    lightyellow: "ffffe0",
+    lime: "0f0",
+    limegreen: "32cd32",
+    linen: "faf0e6",
+    magenta: "f0f",
+    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",
+    rebeccapurple: "639",
+    red: "f00",
+    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: "fff",
+    whitesmoke: "f5f5f5",
+    yellow: "ff0",
+    yellowgreen: "9acd32"
+  };
+  function nameToHex(color2) {
+    if (typeof color2 !== "string")
+      return color2;
+    var normalizedColorName = color2.toLowerCase();
+    return namedColorMap[normalizedColorName] ? "#" + namedColorMap[normalizedColorName] : color2;
+  }
+  var hexRegex = /^#[a-fA-F0-9]{6}$/;
+  var hexRgbaRegex = /^#[a-fA-F0-9]{8}$/;
+  var reducedHexRegex = /^#[a-fA-F0-9]{3}$/;
+  var reducedRgbaHexRegex = /^#[a-fA-F0-9]{4}$/;
+  var rgbRegex = /^rgb\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*\)$/i;
+  var rgbaRegex = /^rgb(?:a)?\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
+  var hslRegex = /^hsl\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*\)$/i;
+  var hslaRegex = /^hsl(?:a)?\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
+  function parseToRgb(color2) {
+    if (typeof color2 !== "string") {
+      throw new PolishedError(3);
+    }
+    var normalizedColor = nameToHex(color2);
+    if (normalizedColor.match(hexRegex)) {
+      return {
+        red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
+        green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
+        blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16)
+      };
+    }
+    if (normalizedColor.match(hexRgbaRegex)) {
+      var alpha = parseFloat((parseInt("" + normalizedColor[7] + normalizedColor[8], 16) / 255).toFixed(2));
+      return {
+        red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
+        green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
+        blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16),
+        alpha
+      };
+    }
+    if (normalizedColor.match(reducedHexRegex)) {
+      return {
+        red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
+        green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
+        blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16)
+      };
+    }
+    if (normalizedColor.match(reducedRgbaHexRegex)) {
+      var _alpha = parseFloat((parseInt("" + normalizedColor[4] + normalizedColor[4], 16) / 255).toFixed(2));
+      return {
+        red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
+        green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
+        blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16),
+        alpha: _alpha
+      };
+    }
+    var rgbMatched = rgbRegex.exec(normalizedColor);
+    if (rgbMatched) {
+      return {
+        red: parseInt("" + rgbMatched[1], 10),
+        green: parseInt("" + rgbMatched[2], 10),
+        blue: parseInt("" + rgbMatched[3], 10)
+      };
+    }
+    var rgbaMatched = rgbaRegex.exec(normalizedColor.substring(0, 50));
+    if (rgbaMatched) {
+      return {
+        red: parseInt("" + rgbaMatched[1], 10),
+        green: parseInt("" + rgbaMatched[2], 10),
+        blue: parseInt("" + rgbaMatched[3], 10),
+        alpha: parseFloat("" + rgbaMatched[4]) > 1 ? parseFloat("" + rgbaMatched[4]) / 100 : parseFloat("" + rgbaMatched[4])
+      };
+    }
+    var hslMatched = hslRegex.exec(normalizedColor);
+    if (hslMatched) {
+      var hue = parseInt("" + hslMatched[1], 10);
+      var saturation = parseInt("" + hslMatched[2], 10) / 100;
+      var lightness = parseInt("" + hslMatched[3], 10) / 100;
+      var rgbColorString = "rgb(" + hslToRgb(hue, saturation, lightness) + ")";
+      var hslRgbMatched = rgbRegex.exec(rgbColorString);
+      if (!hslRgbMatched) {
+        throw new PolishedError(4, normalizedColor, rgbColorString);
+      }
+      return {
+        red: parseInt("" + hslRgbMatched[1], 10),
+        green: parseInt("" + hslRgbMatched[2], 10),
+        blue: parseInt("" + hslRgbMatched[3], 10)
+      };
+    }
+    var hslaMatched = hslaRegex.exec(normalizedColor.substring(0, 50));
+    if (hslaMatched) {
+      var _hue = parseInt("" + hslaMatched[1], 10);
+      var _saturation = parseInt("" + hslaMatched[2], 10) / 100;
+      var _lightness = parseInt("" + hslaMatched[3], 10) / 100;
+      var _rgbColorString = "rgb(" + hslToRgb(_hue, _saturation, _lightness) + ")";
+      var _hslRgbMatched = rgbRegex.exec(_rgbColorString);
+      if (!_hslRgbMatched) {
+        throw new PolishedError(4, normalizedColor, _rgbColorString);
+      }
+      return {
+        red: parseInt("" + _hslRgbMatched[1], 10),
+        green: parseInt("" + _hslRgbMatched[2], 10),
+        blue: parseInt("" + _hslRgbMatched[3], 10),
+        alpha: parseFloat("" + hslaMatched[4]) > 1 ? parseFloat("" + hslaMatched[4]) / 100 : parseFloat("" + hslaMatched[4])
+      };
+    }
+    throw new PolishedError(5);
+  }
+  function rgbToHsl(color2) {
+    var red = color2.red / 255;
+    var green = color2.green / 255;
+    var blue = color2.blue / 255;
+    var max2 = Math.max(red, green, blue);
+    var min2 = Math.min(red, green, blue);
+    var lightness = (max2 + min2) / 2;
+    if (max2 === min2) {
+      if (color2.alpha !== void 0) {
+        return {
+          hue: 0,
+          saturation: 0,
+          lightness,
+          alpha: color2.alpha
+        };
+      } else {
+        return {
+          hue: 0,
+          saturation: 0,
+          lightness
+        };
+      }
+    }
+    var hue;
+    var delta = max2 - min2;
+    var saturation = lightness > 0.5 ? delta / (2 - max2 - min2) : delta / (max2 + min2);
+    switch (max2) {
+      case red:
+        hue = (green - blue) / delta + (green < blue ? 6 : 0);
+        break;
+      case green:
+        hue = (blue - red) / delta + 2;
+        break;
+      default:
+        hue = (red - green) / delta + 4;
+        break;
+    }
+    hue *= 60;
+    if (color2.alpha !== void 0) {
+      return {
+        hue,
+        saturation,
+        lightness,
+        alpha: color2.alpha
+      };
+    }
+    return {
+      hue,
+      saturation,
+      lightness
+    };
+  }
+  function parseToHsl(color2) {
+    return rgbToHsl(parseToRgb(color2));
+  }
+  var reduceHexValue = function reduceHexValue2(value) {
+    if (value.length === 7 && value[1] === value[2] && value[3] === value[4] && value[5] === value[6]) {
+      return "#" + value[1] + value[3] + value[5];
+    }
+    return value;
+  };
+  var reduceHexValue$1 = reduceHexValue;
+  function numberToHex(value) {
+    var hex2 = value.toString(16);
+    return hex2.length === 1 ? "0" + hex2 : hex2;
+  }
+  function colorToHex(color2) {
+    return numberToHex(Math.round(color2 * 255));
+  }
+  function convertToHex(red, green, blue) {
+    return reduceHexValue$1("#" + colorToHex(red) + colorToHex(green) + colorToHex(blue));
+  }
+  function hslToHex(hue, saturation, lightness) {
+    return hslToRgb(hue, saturation, lightness, convertToHex);
+  }
+  function hsl(value, saturation, lightness) {
+    if (typeof value === "number" && typeof saturation === "number" && typeof lightness === "number") {
+      return hslToHex(value, saturation, lightness);
+    } else if (typeof value === "object" && saturation === void 0 && lightness === void 0) {
+      return hslToHex(value.hue, value.saturation, value.lightness);
+    }
+    throw new PolishedError(1);
+  }
+  function hsla$1(value, saturation, lightness, alpha) {
+    if (typeof value === "number" && typeof saturation === "number" && typeof lightness === "number" && typeof alpha === "number") {
+      return alpha >= 1 ? hslToHex(value, saturation, lightness) : "rgba(" + hslToRgb(value, saturation, lightness) + "," + alpha + ")";
+    } else if (typeof value === "object" && saturation === void 0 && lightness === void 0 && alpha === void 0) {
+      return value.alpha >= 1 ? hslToHex(value.hue, value.saturation, value.lightness) : "rgba(" + hslToRgb(value.hue, value.saturation, value.lightness) + "," + value.alpha + ")";
+    }
+    throw new PolishedError(2);
+  }
+  function rgb(value, green, blue) {
+    if (typeof value === "number" && typeof green === "number" && typeof blue === "number") {
+      return reduceHexValue$1("#" + numberToHex(value) + numberToHex(green) + numberToHex(blue));
+    } else if (typeof value === "object" && green === void 0 && blue === void 0) {
+      return reduceHexValue$1("#" + numberToHex(value.red) + numberToHex(value.green) + numberToHex(value.blue));
+    }
+    throw new PolishedError(6);
+  }
+  function rgba$1(firstValue, secondValue, thirdValue, fourthValue) {
+    if (typeof firstValue === "string" && typeof secondValue === "number") {
+      var rgbValue = parseToRgb(firstValue);
+      return "rgba(" + rgbValue.red + "," + rgbValue.green + "," + rgbValue.blue + "," + secondValue + ")";
+    } else if (typeof firstValue === "number" && typeof secondValue === "number" && typeof thirdValue === "number" && typeof fourthValue === "number") {
+      return fourthValue >= 1 ? rgb(firstValue, secondValue, thirdValue) : "rgba(" + firstValue + "," + secondValue + "," + thirdValue + "," + fourthValue + ")";
+    } else if (typeof firstValue === "object" && secondValue === void 0 && thirdValue === void 0 && fourthValue === void 0) {
+      return firstValue.alpha >= 1 ? rgb(firstValue.red, firstValue.green, firstValue.blue) : "rgba(" + firstValue.red + "," + firstValue.green + "," + firstValue.blue + "," + firstValue.alpha + ")";
+    }
+    throw new PolishedError(7);
+  }
+  var isRgb = function isRgb2(color2) {
+    return typeof color2.red === "number" && typeof color2.green === "number" && typeof color2.blue === "number" && (typeof color2.alpha !== "number" || typeof color2.alpha === "undefined");
+  };
+  var isRgba = function isRgba2(color2) {
+    return typeof color2.red === "number" && typeof color2.green === "number" && typeof color2.blue === "number" && typeof color2.alpha === "number";
+  };
+  var isHsl = function isHsl2(color2) {
+    return typeof color2.hue === "number" && typeof color2.saturation === "number" && typeof color2.lightness === "number" && (typeof color2.alpha !== "number" || typeof color2.alpha === "undefined");
+  };
+  var isHsla = function isHsla2(color2) {
+    return typeof color2.hue === "number" && typeof color2.saturation === "number" && typeof color2.lightness === "number" && typeof color2.alpha === "number";
+  };
+  function toColorString(color2) {
+    if (typeof color2 !== "object")
+      throw new PolishedError(8);
+    if (isRgba(color2))
+      return rgba$1(color2);
+    if (isRgb(color2))
+      return rgb(color2);
+    if (isHsla(color2))
+      return hsla$1(color2);
+    if (isHsl(color2))
+      return hsl(color2);
+    throw new PolishedError(8);
+  }
+  function curried(f2, length, acc) {
+    return function fn2() {
+      var combined = acc.concat(Array.prototype.slice.call(arguments));
+      return combined.length >= length ? f2.apply(this, combined) : curried(f2, length, combined);
+    };
+  }
+  function curry(f2) {
+    return curried(f2, f2.length, []);
+  }
+  function adjustHue(degree, color2) {
+    if (color2 === "transparent")
+      return color2;
+    var hslColor = parseToHsl(color2);
+    return toColorString(_extends$3({}, hslColor, {
+      hue: hslColor.hue + parseFloat(degree)
+    }));
+  }
+  curry(adjustHue);
+  function guard(lowerBoundary, upperBoundary, value) {
+    return Math.max(lowerBoundary, Math.min(upperBoundary, value));
+  }
+  function darken(amount, color2) {
+    if (color2 === "transparent")
+      return color2;
+    var hslColor = parseToHsl(color2);
+    return toColorString(_extends$3({}, hslColor, {
+      lightness: guard(0, 1, hslColor.lightness - parseFloat(amount))
+    }));
+  }
+  curry(darken);
+  function desaturate(amount, color2) {
+    if (color2 === "transparent")
+      return color2;
+    var hslColor = parseToHsl(color2);
+    return toColorString(_extends$3({}, hslColor, {
+      saturation: guard(0, 1, hslColor.saturation - parseFloat(amount))
+    }));
+  }
+  curry(desaturate);
+  function lighten(amount, color2) {
+    if (color2 === "transparent")
+      return color2;
+    var hslColor = parseToHsl(color2);
+    return toColorString(_extends$3({}, hslColor, {
+      lightness: guard(0, 1, hslColor.lightness + parseFloat(amount))
+    }));
+  }
+  curry(lighten);
+  function mix(weight, color2, otherColor) {
+    if (color2 === "transparent")
+      return otherColor;
+    if (otherColor === "transparent")
+      return color2;
+    if (weight === 0)
+      return otherColor;
+    var parsedColor1 = parseToRgb(color2);
+    var color1 = _extends$3({}, parsedColor1, {
+      alpha: typeof parsedColor1.alpha === "number" ? parsedColor1.alpha : 1
+    });
+    var parsedColor2 = parseToRgb(otherColor);
+    var color22 = _extends$3({}, parsedColor2, {
+      alpha: typeof parsedColor2.alpha === "number" ? parsedColor2.alpha : 1
+    });
+    var alphaDelta = color1.alpha - color22.alpha;
+    var x2 = parseFloat(weight) * 2 - 1;
+    var y2 = x2 * alphaDelta === -1 ? x2 : x2 + alphaDelta;
+    var z2 = 1 + x2 * alphaDelta;
+    var weight1 = (y2 / z2 + 1) / 2;
+    var weight2 = 1 - weight1;
+    var mixedColor = {
+      red: Math.floor(color1.red * weight1 + color22.red * weight2),
+      green: Math.floor(color1.green * weight1 + color22.green * weight2),
+      blue: Math.floor(color1.blue * weight1 + color22.blue * weight2),
+      alpha: color1.alpha * parseFloat(weight) + color22.alpha * (1 - parseFloat(weight))
+    };
+    return rgba$1(mixedColor);
+  }
+  var curriedMix = curry(mix);
+  var mix$1 = curriedMix;
+  function opacify(amount, color2) {
+    if (color2 === "transparent")
+      return color2;
+    var parsedColor = parseToRgb(color2);
+    var alpha = typeof parsedColor.alpha === "number" ? parsedColor.alpha : 1;
+    var colorWithAlpha = _extends$3({}, parsedColor, {
+      alpha: guard(0, 1, (alpha * 100 + parseFloat(amount) * 100) / 100)
+    });
+    return rgba$1(colorWithAlpha);
+  }
+  curry(opacify);
+  function saturate(amount, color2) {
+    if (color2 === "transparent")
+      return color2;
+    var hslColor = parseToHsl(color2);
+    return toColorString(_extends$3({}, hslColor, {
+      saturation: guard(0, 1, hslColor.saturation + parseFloat(amount))
+    }));
+  }
+  curry(saturate);
+  function setHue(hue, color2) {
+    if (color2 === "transparent")
+      return color2;
+    return toColorString(_extends$3({}, parseToHsl(color2), {
+      hue: parseFloat(hue)
+    }));
+  }
+  curry(setHue);
+  function setLightness(lightness, color2) {
+    if (color2 === "transparent")
+      return color2;
+    return toColorString(_extends$3({}, parseToHsl(color2), {
+      lightness: parseFloat(lightness)
+    }));
+  }
+  curry(setLightness);
+  function setSaturation(saturation, color2) {
+    if (color2 === "transparent")
+      return color2;
+    return toColorString(_extends$3({}, parseToHsl(color2), {
+      saturation: parseFloat(saturation)
+    }));
+  }
+  curry(setSaturation);
+  function shade(percentage, color2) {
+    if (color2 === "transparent")
+      return color2;
+    return mix$1(parseFloat(percentage), "rgb(0, 0, 0)", color2);
+  }
+  curry(shade);
+  function tint(percentage, color2) {
+    if (color2 === "transparent")
+      return color2;
+    return mix$1(parseFloat(percentage), "rgb(255, 255, 255)", color2);
+  }
+  curry(tint);
+  function transparentize(amount, color2) {
+    if (color2 === "transparent")
+      return color2;
+    var parsedColor = parseToRgb(color2);
+    var alpha = typeof parsedColor.alpha === "number" ? parsedColor.alpha : 1;
+    var colorWithAlpha = _extends$3({}, parsedColor, {
+      alpha: guard(0, 1, +(alpha * 100 - parseFloat(amount) * 100).toFixed(2) / 100)
+    });
+    return rgba$1(colorWithAlpha);
+  }
+  curry(transparentize);
   const NotificationWrapper$1 = styled__default.default.div`
     pointer-events: auto;
 
@@ -334126,7 +334696,7 @@ ${e3}`);
   const _BitmapText = class extends Container {
     constructor(text2, style2 = {}) {
       super();
-      const { align, tint, maxWidth, letterSpacing, fontName, fontSize: fontSize2 } = Object.assign({}, _BitmapText.styleDefaults, style2);
+      const { align, tint: tint2, maxWidth, letterSpacing, fontName, fontSize: fontSize2 } = Object.assign({}, _BitmapText.styleDefaults, style2);
       if (!BitmapFont.available[fontName]) {
         throw new Error(`Missing BitmapFont "${fontName}"`);
       }
@@ -334134,7 +334704,7 @@ ${e3}`);
       this._textWidth = 0;
       this._textHeight = 0;
       this._align = align;
-      this._tintColor = new Color(tint);
+      this._tintColor = new Color(tint2);
       this._font = void 0;
       this._fontName = fontName;
       this._fontSize = fontSize2;
@@ -368349,7 +368919,7 @@ ${e3}`);
         }
       }
     };
-    var darken = function darken2() {
+    var darken2 = function darken3() {
       var darkenOpacity = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : eleOpacity;
       var opacity = (darkness > 0 ? darkness : -darkness) * darkenOpacity;
       var c2 = darkness > 0 ? 0 : 255;
@@ -368532,7 +369102,7 @@ ${e3}`);
       drawBorder();
       drawPie(darkness !== 0 || borderWidth !== 0);
       drawImages(effGhostOpacity, false);
-      darken(effGhostOpacity);
+      darken2(effGhostOpacity);
       context2.translate(-gx, -gy);
     }
     if (usePaths) {
@@ -368551,7 +369121,7 @@ ${e3}`);
     drawBorder();
     drawPie(darkness !== 0 || borderWidth !== 0);
     drawImages(eleOpacity, false);
-    darken();
+    darken2();
     if (usePaths) {
       context2.translate(-pos.x, -pos.y);
     }
@@ -382953,10 +383523,10 @@ void main(void){
       }
     }
   }
-  function createSideSymbol(style2, position2, tint, bgTint) {
+  function createSideSymbol(style2, position2, tint2, bgTint) {
     var _a3, _b;
     const gfx = new SmoothGraphics();
-    const color2 = tint;
+    const color2 = tint2;
     if ([EditorMode.RESOLVER, EditorMode.DEFAULT, EditorMode.EDGE_ENCODER].includes(style2.editorMode)) {
       if (position2 === "bottom") {
         return gfx;
@@ -383200,9 +383770,9 @@ void main(void){
     static updateEdgeSymbolsStyle(edgeGfx, edgeSymbolsGfx, edgeStyle, textureCache) {
       var _a3, _b, _c, _d;
       const edgeTopSymbol = edgeSymbolsGfx.getChildByName(EDGE_TOP_SYMBOL);
-      const [tint] = colorToPixi(edgeStyle.color);
+      const [tint2] = colorToPixi(edgeStyle.color);
       const [bgTint] = colorToPixi(edgeStyle.theme.colors.blue1);
-      const topSymbolTexture = textureCache.get(createKey(EDGE_TOP_SYMBOL, edgeStyle.editorMode, edgeStyle.type, tint, bgTint, (_a3 = edgeStyle.constraint) === null || _a3 === void 0 ? void 0 : _a3.type), () => createSideSymbol(edgeStyle, "top", tint, bgTint), 1);
+      const topSymbolTexture = textureCache.get(createKey(EDGE_TOP_SYMBOL, edgeStyle.editorMode, edgeStyle.type, tint2, bgTint, (_a3 = edgeStyle.constraint) === null || _a3 === void 0 ? void 0 : _a3.type), () => createSideSymbol(edgeStyle, "top", tint2, bgTint), 1);
       edgeTopSymbol.texture = topSymbolTexture;
       edgeTopSymbol.position.y = edgeGfx.height / 2 - EDGE_OFFSET;
       edgeTopSymbol.alpha = 1;
@@ -383215,7 +383785,7 @@ void main(void){
         edgeCenterSymbol.rotation = -1 * edgeGfx.rotation;
       }
       const edgeBottomSymbol = edgeSymbolsGfx.getChildByName(EDGE_BOTTOM_SYMBOL);
-      const bottomSymbolTexture = textureCache.get(createKey(EDGE_BOTTOM_SYMBOL, edgeStyle.editorMode, edgeStyle.type, tint, bgTint, (_c = edgeStyle.constraint) === null || _c === void 0 ? void 0 : _c.type), () => createSideSymbol(edgeStyle, "bottom", tint, bgTint), 1);
+      const bottomSymbolTexture = textureCache.get(createKey(EDGE_BOTTOM_SYMBOL, edgeStyle.editorMode, edgeStyle.type, tint2, bgTint, (_c = edgeStyle.constraint) === null || _c === void 0 ? void 0 : _c.type), () => createSideSymbol(edgeStyle, "bottom", tint2, bgTint), 1);
       edgeBottomSymbol.texture = bottomSymbolTexture;
       edgeBottomSymbol.position.y = -1 * edgeTopSymbol.position.y;
       edgeBottomSymbol.alpha = 1;