@splunk/react-ui 5.0.0-beta.5 → 5.0.0-rc.2

package/Color.js

@@ -3,22 +3,22 @@
     /******/ "use strict";
     /******/    var e = {
         /***/ 6165: 
-        /***/ (e, r, n) => {
+        /***/ (e, r, t) => {
             // EXPORTS
-            n.d(r, {
+            t.d(r, {
                 default: () => /* reexport */ y
             });
             // EXTERNAL MODULE: external "react"
-                        var t = n(9497);
-            var a =  n.n(t);
+                        var n = t(9497);
+            var a =  t.n(n);
             // EXTERNAL MODULE: external "prop-types"
-                        var l = n(23);
-            var o =  n.n(l);
+                        var o = t(23);
+            var l =  t.n(o);
             // EXTERNAL MODULE: external "styled-components"
-                        var i = n(232);
-            var u =  n.n(i);
+                        var i = t(232);
+            var u =  t.n(i);
             // EXTERNAL MODULE: external "@splunk/themes"
-                        var s = n(3563);
+                        var s = t(3563);
             // CONCATENATED MODULE: ./src/ScreenReaderContent/ScreenReaderContentStyles.ts
             var c = u().span.withConfig({
                 displayName: "ScreenReaderContentStyles__Styled",
@@ -28,9 +28,9 @@
             function d() {
                 return d = Object.assign ? Object.assign.bind() : function(e) {
                     for (var r = 1; r < arguments.length; r++) {
-                        var n = arguments[r];
-                        for (var t in n) {
-                            ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+                        var t = arguments[r];
+                        for (var n in t) {
+                            ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
                         }
                     }
                     return e;
@@ -38,43 +38,43 @@
             }
             function f(e, r) {
                 if (null == e) return {};
-                var n, t, a = v(e, r);
+                var t, n, a = p(e, r);
                 if (Object.getOwnPropertySymbols) {
-                    var l = Object.getOwnPropertySymbols(e);
-                    for (t = 0; t < l.length; t++) {
-                        n = l[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (a[n] = e[n]);
+                    var o = Object.getOwnPropertySymbols(e);
+                    for (n = 0; n < o.length; n++) {
+                        t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                     }
                 }
                 return a;
             }
-            function v(e, r) {
+            function p(e, r) {
                 if (null == e) return {};
-                var n = {};
-                for (var t in e) {
-                    if ({}.hasOwnProperty.call(e, t)) {
-                        if (r.includes(t)) continue;
-                        n[t] = e[t];
+                var t = {};
+                for (var n in e) {
+                    if ({}.hasOwnProperty.call(e, n)) {
+                        if (r.includes(n)) continue;
+                        t[n] = e[n];
                     }
                 }
-                return n;
+                return t;
             }
-            var p = {
-                children: o().node.isRequired,
-                elementRef: o().oneOfType([ o().func, o().object ])
+            var v = {
+                children: l().node.isRequired,
+                elementRef: l().oneOfType([ l().func, l().object ])
             };
             /**
  * The screen reader text is used to wrap content that
  * is only accessible through screen readers.
  */            function b(e) {
-                var r = e.children, n = e.elementRef, t = f(e, [ "children", "elementRef" ]);
+                var r = e.children, t = e.elementRef, n = f(e, [ "children", "elementRef" ]);
                 // @docs-props-type ScreenReaderContentPropsBase
                                 
                 return a().createElement(c, d({
                     "data-test": "screen-reader-content",
-                    ref: n
-                }, t), r);
+                    ref: t
+                }, n), r);
             }
-            b.propTypes = p;
+            b.propTypes = v;
             /* harmony default export */            const y = b;
         } // CONCATENATED MODULE: ./src/ScreenReaderContent/index.ts
         /***/ ,
@@ -101,36 +101,36 @@
     /******/    var r = {};
     /******/
     /******/ // The require function
-    /******/    function n(t) {
+    /******/    function t(n) {
         /******/ // Check if module is in cache
-        /******/ var a = r[t];
+        /******/ var a = r[n];
         /******/        if (a !== undefined) {
             /******/ return a.exports;
             /******/        }
         /******/ // Create a new module (and put it into the cache)
-        /******/        var l = r[t] = {
+        /******/        var o = r[n] = {
             /******/ // no module.id needed
             /******/ // no module.loaded needed
             /******/ exports: {}
             /******/        };
         /******/
         /******/ // Execute the module function
-        /******/        e[t](l, l.exports, n);
+        /******/        e[n](o, o.exports, t);
         /******/
         /******/ // Return the exports of the module
-        /******/        return l.exports;
+        /******/        return o.exports;
         /******/    }
     /******/
     /************************************************************************/
     /******/ /* webpack/runtime/compat get default export */
     /******/    (() => {
         /******/ // getDefaultExport function for compatibility with non-harmony modules
-        /******/ n.n = e => {
+        /******/ t.n = e => {
             /******/ var r = e && e.__esModule ? 
             /******/ () => e["default"]
             /******/ : () => e
             /******/;
-            n.d(r, {
+            t.d(r, {
                 a: r
             });
             /******/            return r;
@@ -140,12 +140,12 @@
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ n.d = (e, r) => {
-            /******/ for (var t in r) {
-                /******/ if (n.o(r, t) && !n.o(e, t)) {
-                    /******/ Object.defineProperty(e, t, {
+        /******/ t.d = (e, r) => {
+            /******/ for (var n in r) {
+                /******/ if (t.o(r, n) && !t.o(e, n)) {
+                    /******/ Object.defineProperty(e, n, {
                         enumerable: true,
-                        get: r[t]
+                        get: r[n]
                     });
                     /******/                }
                 /******/            }
@@ -154,14 +154,14 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ n.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
+        /******/ t.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
         /******/;
     })();
     /******/
     /******/ /* webpack/runtime/make namespace object */
     /******/    (() => {
         /******/ // define __esModule on exports
-        /******/ n.r = e => {
+        /******/ t.r = e => {
             /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
                 /******/ Object.defineProperty(e, Symbol.toStringTag, {
                     value: "Module"
@@ -173,126 +173,132 @@
             /******/        };
         /******/    })();
     /******/
-    /************************************************************************/    var t = {};
+    /************************************************************************/    var n = {};
     // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
         (() => {
         // ESM COMPAT FLAG
-        n.r(t);
+        t.r(n);
         // EXPORTS
-                n.d(t, {
-            default: () => /* reexport */ Qe,
-            defaultPalette: () => /* reexport */ Be
+                t.d(n, {
+            default: () => /* reexport */ cr,
+            defaultPalette: () => /* reexport */ $e
         });
         // EXTERNAL MODULE: external "react"
-                var e = n(9497);
-        var r =  n.n(e);
+                var e = t(9497);
+        var r =  t.n(e);
         // EXTERNAL MODULE: external "prop-types"
-                var a = n(23);
-        var l =  n.n(a);
+                var a = t(23);
+        var o =  t.n(a);
+        // CONCATENATED MODULE: external "lodash/omit"
+        const l = require("lodash/omit");
+        var i =  t.n(l);
+        // CONCATENATED MODULE: external "lodash/pickBy"
+        const u = require("lodash/pickBy");
+        var s =  t.n(u);
         // CONCATENATED MODULE: external "@splunk/react-ui/Dropdown"
-        const o = require("@splunk/react-ui/Dropdown");
-        var i =  n.n(o);
+        const c = require("@splunk/react-ui/Dropdown");
+        var d =  t.n(c);
         // CONCATENATED MODULE: external "@splunk/react-ui/usePrevious"
-        const u = require("@splunk/react-ui/usePrevious");
-        var s =  n.n(u);
+        const f = require("@splunk/react-ui/usePrevious");
+        var p =  t.n(f);
         // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
-        const c = require("@splunk/react-ui/useControlled");
-        var d =  n.n(c);
+        const v = require("@splunk/react-ui/useControlled");
+        var b =  t.n(v);
         // CONCATENATED MODULE: external "@splunk/ui-utils/color"
-        const f = require("@splunk/ui-utils/color");
+        const y = require("@splunk/ui-utils/color");
         // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
-        const v = require("@splunk/ui-utils/i18n");
+        const m = require("@splunk/ui-utils/i18n");
         // CONCATENATED MODULE: external "@splunk/ui-utils/id"
-        const p = require("@splunk/ui-utils/id");
+        const h = require("@splunk/ui-utils/id");
         // EXTERNAL MODULE: external "styled-components"
-                var b = n(232);
-        var y =  n.n(b);
+                var g = t(232);
+        var w =  t.n(g);
         // EXTERNAL MODULE: external "@splunk/themes"
-                var m = n(3563);
+                var S = t(3563);
         // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
-        const h = require("@splunk/react-ui/ScreenReaderContent");
-        var g =  n.n(h);
+        const C = require("@splunk/react-ui/ScreenReaderContent");
+        var O =  t.n(C);
         // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
-        const w = require("@splunk/react-ui/Tooltip");
-        var C =  n.n(w);
+        const x = require("@splunk/react-ui/Tooltip");
+        var k =  t.n(x);
         // CONCATENATED MODULE: external "@splunk/react-icons/Palette"
-        const S = require("@splunk/react-icons/Palette");
-        var x =  n.n(S);
+        const j = require("@splunk/react-icons/Palette");
+        var E =  t.n(j);
         // CONCATENATED MODULE: external "@splunk/react-ui/Text"
-        const k = require("@splunk/react-ui/Text");
-        var O =  n.n(k);
+        const I = require("@splunk/react-ui/Text");
+        var P =  t.n(I);
         // CONCATENATED MODULE: ./src/Color/ColorInputStyles.ts
         // The text input displayed initially (not in the dropdown) is set to 104px to accommodate the
         // largest accepted value for Color, which is 'transparent,' while maintaining the base 8px grid.
-        var E = "104px";
-        var I = y().div.withConfig({
+        var _ = "104px";
+        var q = w().div.withConfig({
             displayName: "ColorInputStyles__StyledTextWrapper",
             componentId: "sc-80hen8-0"
-        })([ "display:flex;width:", ";flex:1 0 auto;" ], E);
-        var _ = y()(O()).withConfig({
+        })([ "display:flex;width:", ";flex:1 0 auto;" ], _);
+        var B = w()(P()).withConfig({
             displayName: "ColorInputStyles__StyledText",
             componentId: "sc-80hen8-1"
-        })([ "width:", ";" ], E);
-        var j = y().div.withConfig({
+        })([ "width:", ";" ], _);
+        var R = w().div.withConfig({
             displayName: "ColorInputStyles__StyledSystemColorPickerWrapper",
             componentId: "sc-80hen8-2"
-        })([ "position:relative;height:", ";width:", ";border:", " solid ", ";box-sizing:border-box;border-radius:", ";", " ", " &:focus-within{box-shadow:", ";}" ], m.variables.inputHeight, m.variables.inputHeight, m.variables.inputBorderWidth, m.variables.interactiveColorBorder, m.variables.borderRadius, (function(e) {
+        })([ "position:relative;height:", ";width:", ";border:", " solid ", ";box-sizing:border-box;border-radius:", ";", " ", " &:focus-within{box-shadow:", ";}" ], S.variables.inputHeight, S.variables.inputHeight, S.variables.inputBorderWidth, S.variables.interactiveColorBorder, S.variables.borderRadius, (function(e) {
             var r = e.$append;
-            return r && (0, b.css)([ "margin-inline-end:-1px;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none;" ]);
+            return r && (0, g.css)([ "margin-inline-end:-1px;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none;" ]);
         }), (function(e) {
             var r = e.$prepend;
-            return r && (0, b.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
-        }), m.variables.focusShadow);
-        var P = y().input.withConfig({
+            return r && (0, g.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
+        }), S.variables.focusShadow);
+        var A = w().input.withConfig({
             displayName: "ColorInputStyles__StyledSystemColorPicker",
             componentId: "sc-80hen8-3"
-        })([ "opacity:0;width:100%;height:100%;border:", " solid transparent;cursor:pointer;pointer-events:auto;" ], m.variables.inputBorderWidth);
-        var q = y()(x()).withConfig({
+        })([ "opacity:0;width:100%;height:100%;border:", " solid transparent;cursor:pointer;pointer-events:auto;" ], S.variables.inputBorderWidth);
+        var T = w()(E()).withConfig({
             displayName: "ColorInputStyles__StyledColorPickerIcon",
             componentId: "sc-80hen8-4"
         })([ "box-sizing:border-box;height:100%;margin:auto;position:absolute;right:0;left:0;pointer-events:none;" ]);
         // CONCATENATED MODULE: external "@splunk/react-icons/Checkmark"
-        const B = require("@splunk/react-icons/Checkmark");
-        var R =  n.n(B);
+        const $ = require("@splunk/react-icons/Checkmark");
+        var D =  t.n($);
         // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
-        const $ = require("@splunk/react-ui/Clickable");
-        var T =  n.n($);
+        const N = require("@splunk/react-ui/Clickable");
+        var H =  t.n(N);
         // CONCATENATED MODULE: ./src/utils/determineTextBrightness.ts
-        function A(e, r) {
-            return M(e) || F(e, r) || H(e, r) || N();
+        function F(e, r) {
+            return W(e) || V(e, r) || L(e, r) || M();
         }
-        function N() {
+        function M() {
             throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
         }
-        function H(e, r) {
+        function L(e, r) {
             if (e) {
-                if ("string" == typeof e) return D(e, r);
-                var n = {}.toString.call(e).slice(8, -1);
-                return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? D(e, r) : void 0;
+                if ("string" == typeof e) return z(e, r);
+                var t = {}.toString.call(e).slice(8, -1);
+                return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? z(e, r) : void 0;
             }
         }
-        function D(e, r) {
+        function z(e, r) {
             (null == r || r > e.length) && (r = e.length);
-            for (var n = 0, t = Array(r); n < r; n++) {
-                t[n] = e[n];
+            for (var t = 0, n = Array(r); t < r; t++) {
+                n[t] = e[t];
             }
-            return t;
+            return n;
         }
-        function F(e, r) {
-            var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-            if (null != n) {
-                var t, a, l, o, i = [], u = !0, s = !1;
+        function V(e, r) {
+            var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+            if (null != t) {
+                var n, a, o, l, i = [], u = !0, s = !1;
                 try {
-                    if (l = (n = n.call(e)).next, 0 === r) {
-                        if (Object(n) !== n) return;
+                    if (o = (t = t.call(e)).next, 0 === r) {
+                        if (Object(t) !== t) return;
                         u = !1;
-                    } else for (;!(u = (t = l.call(n)).done) && (i.push(t.value), i.length !== r); u = !0) {
+                    } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
                     }
                 } catch (e) {
                     s = !0, a = e;
                 } finally {
                     try {
-                        if (!u && null != n["return"] && (o = n["return"](), Object(o) !== o)) return;
+                        if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
                     } finally {
                         if (s) throw a;
                     }
@@ -300,16 +306,16 @@
                 return i;
             }
         }
-        function M(e) {
+        function W(e) {
             if (Array.isArray(e)) return e;
         }
-        var L = "lightText";
-        var z = "darkText";
-        function V(e) {
-            var r = A(e, 3), n = r[0], t = r[1], a = r[2];
-            var l = (n * 299 + t * 587 + a * 114) / 1e3;
+        var K = "lightText";
+        var U = "darkText";
+        function G(e) {
+            var r = F(e, 3), t = r[0], n = r[1], a = r[2];
+            var o = (t * 299 + n * 587 + a * 114) / 1e3;
  // formula from https://www.w3.org/TR/AERT/#color-contrast
-                        return l > 125 ? z : L;
+                        return o > 125 ? U : K;
         }
         /**
  * Determines if light or dark text should be used over a specific background color by determining the color brightness of a
@@ -324,35 +330,35 @@
  * For example if a background color has a text brightness of 124 when the cutoff is determined by: brightness > 125 ? DARK_TEXT : LIGHT_TEXT
  * 2. If you use a color that is not black for dark text or white for light text that would decrease the likelihood that it would pass contrast with the background color
  * if you use determineTextBrightness to decide whether to use dark or light text.
- */        function W(e, r) {
+ */        function J(e, r) {
             if (typeof r === "string") {
-                if ((0, f.isValidHexColor)(r)) {
+                if ((0, y.isValidHexColor)(r)) {
                     // hex
-                    var n = r;
-                    if (n.length === 3 || n.length === 4) {
+                    var t = r;
+                    if (t.length === 3 || t.length === 4) {
                         // shorthand hex
-                        n = (0, f.expandShortHandHex)(n);
+                        t = (0, y.expandShortHandHex)(t);
                     }
-                    var t = (0, f.hexToRgb)(n);
-                    if (t != null) {
-                        return V(t);
+                    var n = (0, y.hexToRgb)(t);
+                    if (n != null) {
+                        return G(n);
                     }
                 } else if (r.includes(",")) {
-                    if ((0, f.isValidRgb)(r)) {
+                    if ((0, y.isValidRgb)(r)) {
                         // rgb
                         var a = r.replace(/[^\d,]/g, "").split(",").slice(0, 3);
-                        var l = a.map((function(e) {
+                        var o = a.map((function(e) {
                             return parseInt(e, 10);
-                        })), o = A(l, 3), i = o[0], u = o[1], s = o[2];
-                        return V([ i, u, s ]);
+                        })), l = F(o, 3), i = l[0], u = l[1], s = l[2];
+                        return G([ i, u, s ]);
                     }
-                } else if (f.extendedColorKeywords.includes(r.toLowerCase())) {
+                } else if (y.extendedColorKeywords.includes(r.toLowerCase())) {
                     // named color
-                    var c = (0, f.namedColorToHex)(r.toLowerCase());
+                    var c = (0, y.namedColorToHex)(r.toLowerCase());
                     if (c != null) {
-                        var d = (0, f.hexToRgb)(c);
+                        var d = (0, y.hexToRgb)(c);
                         if (d != null) {
-                            return V(d);
+                            return G(d);
                         }
                     }
                 }
@@ -363,44 +369,44 @@
    * TODO: Convert theme variable color variables.neutral200 to rgb dynamically and memoize it (SUI-5731).
    */
             // backgroundColor is either not provided or an accepted representation of color
-                        return e ? z : L;
+                        return e ? U : K;
         }
         // CONCATENATED MODULE: ./src/Color/SwatchStyles.ts
-        var K = "rgba(0, 0, 0, 0.2)";
-        var U = "n/a";
-        var G = "transparent";
-        var J = function e(r, n) {
-            return W(r, n || undefined) === z ? m.variables.black : m.variables.white;
+        var Q = "rgba(0, 0, 0, 0.2)";
+        var X = "n/a";
+        var Y = "transparent";
+        var Z = function e(r, t) {
+            return J(r, t || undefined) === U ? S.variables.black : S.variables.white;
         };
-        var Q = y()(R()).withConfig({
+        var ee = w()(D()).withConfig({
             displayName: "SwatchStyles__StyledCheck",
             componentId: "sc-1wxunhq-0"
         })([ "box-sizing:border-box;", "" ], (function(e) {
             var r = e.$value;
-            return r === G ? (0, b.css)([ "color:", ";" ], m.variables.black) : (0, m.pick)({
-                light: (0, b.css)([ "color:", ";" ], J(true, r)),
-                dark: (0, b.css)([ "color:", ";" ], J(false, r))
+            return r === Y ? (0, g.css)([ "color:", ";" ], S.variables.black) : (0, S.pick)({
+                light: (0, g.css)([ "color:", ";" ], Z(true, r)),
+                dark: (0, g.css)([ "color:", ";" ], Z(false, r))
             });
         }));
-        var X = y().div.withConfig({
+        var re = w().div.withConfig({
             displayName: "SwatchStyles__StyledOuter",
             componentId: "sc-1wxunhq-1"
-        })([ "border:", " solid ", ";border-radius:", ";box-sizing:border-box;height:", ";min-width:", ";&:focus-within{box-shadow:", ";z-index:1;}", " ", " ", "" ], m.variables.inputBorderWidth, m.variables.interactiveColorBorder, m.variables.borderRadius, m.variables.inputHeight, m.variables.inputHeight, m.variables.focusShadow, (function(e) {
+        })([ "border:", " solid ", ";border-radius:", ";box-sizing:border-box;height:", ";min-width:", ";&:focus-within{box-shadow:", ";z-index:1;}", " ", " ", "" ], S.variables.inputBorderWidth, S.variables.interactiveColorBorder, S.variables.borderRadius, S.variables.inputHeight, S.variables.inputHeight, S.variables.focusShadow, (function(e) {
             var r = e.$disabled;
-            return !r && (0, b.css)([ "&:hover{border-color:", ";}" ], m.variables.interactiveColorBorderHover);
+            return !r && (0, g.css)([ "&:hover{border-color:", ";}" ], S.variables.interactiveColorBorderHover);
         }), (function(e) {
             var r = e.$prepend;
-            return r && (0, b.css)([ "margin-left:1px;border-start-start-radius:0;border-end-start-radius:0;" ]);
+            return r && (0, g.css)([ "margin-left:1px;border-start-start-radius:0;border-end-start-radius:0;" ]);
         }), (function(e) {
             var r = e.$append;
-            return r && (0, b.css)([ "border-start-end-radius:0;border-end-end-radius:0;border-right:none;" ]);
+            return r && (0, g.css)([ "border-start-end-radius:0;border-end-end-radius:0;border-right:none;" ]);
         }));
-        var Y = y()(T()).attrs((function(e) {
+        var te = w()(H()).attrs((function(e) {
             var r = e.$value;
             // this avoids styled-components generating a separate class for each swatch color
             // which avoids the "Over 200 classes were generated for component Component" warning
             // when rapidly changing colors (ie. with the system color picker)
-                        return r != null && r !== G ? {
+                        return r != null && r !== Y ? {
                 style: {
                     "background-color": r
                 }
@@ -408,156 +414,156 @@
         })).withConfig({
             displayName: "SwatchStyles__StyledClickable",
             componentId: "sc-1wxunhq-2"
-        })([ "display:block;position:relative;flex:0 0 auto;width:100%;height:100%;border:", " solid ", ";border-radius:3px;", ";", " ", " ", " &[disabled]{background-image:linear-gradient(rgba(255,255,255,0.8),rgba(255,255,255,0.8));}", " ", "" ], m.variables.inputBorderWidth, m.variables.neutral100, (function(e) {
+        })([ "display:block;position:relative;flex:0 0 auto;width:100%;height:100%;border:", " solid ", ";border-radius:3px;", ";", " ", " ", " &[disabled]{background-image:linear-gradient(rgba(255,255,255,0.8),rgba(255,255,255,0.8));}", " ", "" ], S.variables.inputBorderWidth, S.variables.neutral100, (function(e) {
             var r = e.$value;
-            return r === null && (0, b.css)([ "background-image:linear-gradient( to bottom right,transparent 48%,", ",transparent 52% );" ], m.variables.contentColorNegative);
+            return r === null && (0, g.css)([ "background-image:linear-gradient( to bottom right,transparent 48%,", ",transparent 52% );" ], S.variables.contentColorNegative);
         }), (function(e) {
             var r = e.$value;
-            return r === G && (0, b.css)([ "background-image:linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " ),linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " );background-size:10px 10px;background-position:0 0,5px 5px;background-color:", ";" ], K, K, K, K, K, K, m.variables.white);
+            return r === Y && (0, g.css)([ "background-image:linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " ),linear-gradient( 45deg,", " 25%,transparent 25%,transparent 75%,", " 75%,", " );background-size:10px 10px;background-position:0 0,5px 5px;background-color:", ";" ], Q, Q, Q, Q, Q, Q, S.variables.white);
         }), (function(e) {
             var r = e.$prepend;
-            return r && (0, b.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
+            return r && (0, g.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
         }), (function(e) {
             var r = e.$append;
-            return r && (0, b.css)([ "border-start-end-radius:0;border-end-end-radius:0;" ]);
+            return r && (0, g.css)([ "border-start-end-radius:0;border-end-end-radius:0;" ]);
         }), (function(e) {
             var r = e.$hasError;
-            return r && (0, b.css)([ "box-shadow:inset 0 0 0 2px white;border-color:", ";" ], m.variables.interactiveColorAccentError);
+            return r && (0, g.css)([ "box-shadow:inset 0 0 0 2px white;border-color:", ";" ], S.variables.interactiveColorAccentError);
         }), (function(e) {
             var r = e.$showSelected;
-            return r && (0, b.css)([ "display:flex;align-items:center;justify-content:center;" ]);
+            return r && (0, g.css)([ "display:flex;align-items:center;justify-content:center;" ]);
         }));
         // CONCATENATED MODULE: ./src/Color/Swatch.tsx
-        function Z() {
-            return Z = Object.assign ? Object.assign.bind() : function(e) {
+        function ne() {
+            return ne = Object.assign ? Object.assign.bind() : function(e) {
                 for (var r = 1; r < arguments.length; r++) {
-                    var n = arguments[r];
-                    for (var t in n) {
-                        ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+                    var t = arguments[r];
+                    for (var n in t) {
+                        ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
                     }
                 }
                 return e;
-            }, Z.apply(null, arguments);
+            }, ne.apply(null, arguments);
         }
-        function ee(e, r) {
+        function ae(e, r) {
             if (null == e) return {};
-            var n, t, a = re(e, r);
+            var t, n, a = oe(e, r);
             if (Object.getOwnPropertySymbols) {
-                var l = Object.getOwnPropertySymbols(e);
-                for (t = 0; t < l.length; t++) {
-                    n = l[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (a[n] = e[n]);
+                var o = Object.getOwnPropertySymbols(e);
+                for (n = 0; n < o.length; n++) {
+                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
         }
-        function re(e, r) {
+        function oe(e, r) {
             if (null == e) return {};
-            var n = {};
-            for (var t in e) {
-                if ({}.hasOwnProperty.call(e, t)) {
-                    if (r.includes(t)) continue;
-                    n[t] = e[t];
+            var t = {};
+            for (var n in e) {
+                if ({}.hasOwnProperty.call(e, n)) {
+                    if (r.includes(n)) continue;
+                    t[n] = e[n];
                 }
             }
-            return n;
+            return t;
         }
-        var ne = {
-            append: l().bool,
-            elementRef: l().oneOfType([ l().func, l().object ]),
+        var le = {
+            append: o().bool,
+            elementRef: o().oneOfType([ o().func, o().object ]),
             /** @private */
-            error: l().bool,
+            error: o().bool,
             /** @private. Call back function when activated. */
-            onClick: l().func,
-            prepend: l().bool,
-            value: l().string,
+            onClick: o().func,
+            prepend: o().bool,
+            value: o().string,
             /** @private */
-            showSelected: l().bool
+            showSelected: o().bool
         };
-        var te =  r().forwardRef((function(n, t) {
-            var a = n.append, l = n.disabled, o = n.error, i = o === void 0 ? false : o, u = n.onClick, s = n.prepend, c = n.value, d = n.showSelected, p = ee(n, [ "append", "disabled", "error", "onClick", "prepend", "value", "showSelected" ]);
-            var b = c === null || c === undefined ? (0, v._)("No color") : c;
+        var ie =  r().forwardRef((function(t, n) {
+            var a = t.append, o = t.disabled, l = t.error, i = l === void 0 ? false : l, u = t.onClick, s = t.prepend, c = t.value, d = t.showSelected, f = ae(t, [ "append", "disabled", "error", "onClick", "prepend", "value", "showSelected" ]);
+            var p = c === null || c === undefined ? (0, m._)("No color") : c;
             // Only valid hexadecimal strings, 'transparent' and `null` are allowed for background colors
             // Invalid values are converted to `undefined`
-                        var y = c;
-            if (!(typeof y === "string" && ((0, f.isValidHexColor)(y) || y === "transparent")) && y !== null && y !== undefined) {
-                y = undefined;
+                        var v = c;
+            if (!(typeof v === "string" && ((0, y.isValidHexColor)(v) || v === "transparent")) && v !== null && v !== undefined) {
+                v = undefined;
             }
-            var m = (0, e.useCallback)((function(e) {
+            var b = (0, e.useCallback)((function(e) {
                 return u === null || u === void 0 ? void 0 : u(e, {
                     value: c
                 });
             }), [ u, c ]);
             
-            return r().createElement(X, {
-                $disabled: l !== null && l !== void 0 ? l : false,
+            return r().createElement(re, {
+                $disabled: o !== null && o !== void 0 ? o : false,
                 $append: a,
                 $prepend: s
-            },  r().createElement(Y, Z({
-                onClick: m,
-                disabled: l ? "disabled" : undefined,
-                ref: t,
-                $value: y,
+            },  r().createElement(te, ne({
+                onClick: b,
+                disabled: o ? "disabled" : undefined,
+                ref: n,
+                $value: v,
                 $append: a,
                 $prepend: s,
                 $hasError: i,
                 $showSelected: d,
                 "data-test": "swatch",
                 "data-test-value": c
-            }, p), d &&  r().createElement(Q, {
-                "aria-label": (0, v._)("Selected"),
+            }, f), d &&  r().createElement(ee, {
+                "aria-label": (0, m._)("Selected"),
                 role: "presentation",
-                $value: y
-            }),  r().createElement(g(), null, b)));
+                $value: v
+            }),  r().createElement(O(), null, p)));
         }));
-        te.propTypes = ne;
-        /* harmony default export */        const ae = te;
+        ie.propTypes = le;
+        /* harmony default export */        const ue = ie;
         // CONCATENATED MODULE: ./src/Color/ColorInput.tsx
-        function le() {
-            return le = Object.assign ? Object.assign.bind() : function(e) {
+        function se() {
+            return se = Object.assign ? Object.assign.bind() : function(e) {
                 for (var r = 1; r < arguments.length; r++) {
-                    var n = arguments[r];
-                    for (var t in n) {
-                        ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+                    var t = arguments[r];
+                    for (var n in t) {
+                        ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
                     }
                 }
                 return e;
-            }, le.apply(null, arguments);
+            }, se.apply(null, arguments);
         }
-        function oe(e, r) {
-            return de(e) || ce(e, r) || ue(e, r) || ie();
+        function ce(e, r) {
+            return be(e) || ve(e, r) || fe(e, r) || de();
         }
-        function ie() {
+        function de() {
             throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
         }
-        function ue(e, r) {
+        function fe(e, r) {
             if (e) {
-                if ("string" == typeof e) return se(e, r);
-                var n = {}.toString.call(e).slice(8, -1);
-                return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? se(e, r) : void 0;
+                if ("string" == typeof e) return pe(e, r);
+                var t = {}.toString.call(e).slice(8, -1);
+                return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? pe(e, r) : void 0;
             }
         }
-        function se(e, r) {
+        function pe(e, r) {
             (null == r || r > e.length) && (r = e.length);
-            for (var n = 0, t = Array(r); n < r; n++) {
-                t[n] = e[n];
+            for (var t = 0, n = Array(r); t < r; t++) {
+                n[t] = e[t];
             }
-            return t;
+            return n;
         }
-        function ce(e, r) {
-            var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-            if (null != n) {
-                var t, a, l, o, i = [], u = !0, s = !1;
+        function ve(e, r) {
+            var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+            if (null != t) {
+                var n, a, o, l, i = [], u = !0, s = !1;
                 try {
-                    if (l = (n = n.call(e)).next, 0 === r) {
-                        if (Object(n) !== n) return;
+                    if (o = (t = t.call(e)).next, 0 === r) {
+                        if (Object(t) !== t) return;
                         u = !1;
-                    } else for (;!(u = (t = l.call(n)).done) && (i.push(t.value), i.length !== r); u = !0) {
+                    } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
                     }
                 } catch (e) {
                     s = !0, a = e;
                 } finally {
                     try {
-                        if (!u && null != n["return"] && (o = n["return"](), Object(o) !== o)) return;
+                        if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
                     } finally {
                         if (s) throw a;
                     }
@@ -565,60 +571,60 @@
                 return i;
             }
         }
-        function de(e) {
+        function be(e) {
             if (Array.isArray(e)) return e;
         }
-        function fe(e, r) {
+        function ye(e, r) {
             if (null == e) return {};
-            var n, t, a = ve(e, r);
+            var t, n, a = me(e, r);
             if (Object.getOwnPropertySymbols) {
-                var l = Object.getOwnPropertySymbols(e);
-                for (t = 0; t < l.length; t++) {
-                    n = l[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (a[n] = e[n]);
+                var o = Object.getOwnPropertySymbols(e);
+                for (n = 0; n < o.length; n++) {
+                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
         }
-        function ve(e, r) {
+        function me(e, r) {
             if (null == e) return {};
-            var n = {};
-            for (var t in e) {
-                if ({}.hasOwnProperty.call(e, t)) {
-                    if (r.includes(t)) continue;
-                    n[t] = e[t];
+            var t = {};
+            for (var n in e) {
+                if ({}.hasOwnProperty.call(e, n)) {
+                    if (r.includes(n)) continue;
+                    t[n] = e[n];
                 }
             }
-            return n;
+            return t;
         }
         /**
  * Formats the value for display in the input.
- */        var pe = function e(r) {
+ */        var he = function e(r) {
             if (r === undefined) {
                 return "";
             }
             if (r === null) {
-                return U;
+                return X;
             }
-            var n = r.toLowerCase();
-            if (n === U) {
-                return U;
+            var t = r.toLowerCase();
+            if (t === X) {
+                return X;
             }
-            if (n === G) {
-                return G;
+            if (t === Y) {
+                return Y;
             }
             // If the user types in the hexadecimal number without # in front, we add # automatically.
-                        if (!n.startsWith("#")) {
-                var t = "#".concat(n);
-                if ((0, f.isValidHexColor)(t)) {
-                    return (0, f.expandShortHandHex)(t);
+                        if (!t.startsWith("#")) {
+                var n = "#".concat(t);
+                if ((0, y.isValidHexColor)(n)) {
+                    return (0, y.expandShortHandHex)(n);
                 }
             }
-            return (0, f.expandShortHandHex)(n);
+            return (0, y.expandShortHandHex)(t);
         };
         /**
  * Returns the value that's valid for Color's onChange
- */        var be = function e(r) {
-            if (r === U) {
+ */        var ge = function e(r) {
+            if (r === X) {
                 return null;
             }
             if (r === "") {
@@ -626,24 +632,24 @@
             }
             return r;
         };
-        var ye = (0, v._)("Open system color picker");
-        var me = function n(t) {
-            var a = t.allowTransparent, l = t.append, o = t.disabled, i = t.inputRef, u = t.labelledBy, s = t.onChange, c = t.showPicker, d = t.showSubmitButton, b = t.value, y = t.valueIsCustom, m = fe(t, [ "allowTransparent", "append", "disabled", "inputRef", "labelledBy", "onChange", "showPicker", "showSubmitButton", "value", "valueIsCustom" ]);
-            var h = (0, e.useState)((0, p.createDOMID)("hex-input-reader-content")), w = oe(h, 1), S = w[0];
-            var x = (0, e.useState)(""), k = oe(x, 2), O = k[0], E = k[1];
-            var B = (0, e.useState)(""), R = oe(B, 2), $ = R[0], T = R[1];
-            var A = (0, e.useCallback)((function(e) {
-                E(be(e));
-                T(e !== null && e !== void 0 ? e : "");
+        var we = (0, m._)("Open system color picker");
+        var Se = function t(n) {
+            var a = n.allowTransparent, o = n.append, l = n.disabled, i = n.inputRef, u = n.labelledBy, s = n.onChange, c = n.showPicker, d = n.showSubmitButton, f = n.value, p = n.valueIsCustom, v = ye(n, [ "allowTransparent", "append", "disabled", "inputRef", "labelledBy", "onChange", "showPicker", "showSubmitButton", "value", "valueIsCustom" ]);
+            var b = (0, e.useState)((0, h.createDOMID)("hex-input-reader-content")), g = ce(b, 1), w = g[0];
+            var S = (0, e.useState)(""), C = ce(S, 2), x = C[0], j = C[1];
+            var E = (0, e.useState)(""), I = ce(E, 2), P = I[0], _ = I[1];
+            var $ = (0, e.useCallback)((function(e) {
+                j(ge(e));
+                _(e !== null && e !== void 0 ? e : "");
             }), []);
             (0, e.useEffect)((function() {
-                E(be(b));
-                T(pe(b));
-            }), [ b ]);
-            var N = (0, e.useCallback)((function(e) {
-                var r = be(pe($));
-                var n = r !== undefined && (r == null || r === G && a || (0, f.isValidHexColor)(r));
-                if (n) {
+                j(ge(f));
+                _(he(f));
+            }), [ f ]);
+            var D = (0, e.useCallback)((function(e) {
+                var r = ge(he(P));
+                var t = r !== undefined && (r == null || r === Y && a || (0, y.isValidHexColor)(r));
+                if (t) {
                     s === null || s === void 0 ? void 0 : s(e, {
                         value: r
                     });
@@ -651,126 +657,126 @@
                     // eslint-disable-next-line no-console
                     console.warn('"'.concat(r, '" is not a valid hex color.'));
                 }
-            }), [ a, $, s ]);
-            var H = (0, e.useCallback)((function(e, r) {
-                var n = r.value;
-                A(n);
-            }), [ A ]);
-            var D = (0, e.useCallback)((function(e) {
+            }), [ a, P, s ]);
+            var N = (0, e.useCallback)((function(e, r) {
+                var t = r.value;
+                $(t);
+            }), [ $ ]);
+            var H = (0, e.useCallback)((function(e) {
                 if (e.key === "Enter") {
                     e.preventDefault();
-                    N(e);
+                    D(e);
                 }
-            }), [ N ]);
+            }), [ D ]);
             var F = (0, e.useCallback)((function(e) {
                 var r = e.target.value;
-                A(r);
-            }), [ A ]);
-            var M = c &&  r().createElement(C(), {
-                content: ye,
+                $(r);
+            }), [ $ ]);
+            var M = c &&  r().createElement(k(), {
+                content: we,
                 defaultPlacement: "below"
-            },  r().createElement(j, {
-                $append: l,
+            },  r().createElement(R, {
+                $append: o,
                 $prepend: true
-            },  r().createElement(q, null),  r().createElement(P, {
-                "aria-label": ye,
-                disabled: !!o,
+            },  r().createElement(T, null),  r().createElement(A, {
+                "aria-label": we,
+                disabled: !!l,
                 onChange: F,
                 type: "color",
-                value: b === null ? "" : b
+                value: f === null ? "" : f
             })));
             
-            return r().createElement(r().Fragment, null,  r().createElement(I, null,  r().createElement(g(), {
-                id: S
-            }, (0, v._)("Hexadecimal color value")),  r().createElement(_, le({
-                append: l || c,
+            return r().createElement(r().Fragment, null,  r().createElement(q, null,  r().createElement(O(), {
+                id: w
+            }, (0, m._)("Hexadecimal color value")),  r().createElement(B, se({
+                append: o || c,
                 autoCapitalize: "off",
                 autoComplete: "off",
                 autoCorrect: "off",
-                disabled: o,
+                disabled: l,
                 inputRef: i,
-                labelledBy: u ? "".concat(u, " ").concat(S) : S,
-                onChange: H,
-                onKeyDown: D,
+                labelledBy: u ? "".concat(u, " ").concat(w) : w,
+                onChange: N,
+                onKeyDown: H,
                 spellCheck: false,
-                value: $
-            }, m)), M), d &&  r().createElement(ae, {
+                value: P
+            }, v)), M), d &&  r().createElement(ue, {
                 "data-test": "textbox-swatch",
-                disabled: !!o,
-                onClick: N,
-                showSelected: y && O === b,
-                value: O
+                disabled: !!l,
+                onClick: D,
+                showSelected: p && x === f,
+                value: x
             }));
         };
-        /* harmony default export */        const he = me;
+        /* harmony default export */        const Ce = Se;
         // CONCATENATED MODULE: ./src/Color/ColorStyles.ts
-        var ge = y().div.withConfig({
+        var Oe = w().div.withConfig({
             displayName: "ColorStyles__StyledColor",
             componentId: "jxrost-0"
-        })([ "", ";flex-direction:row;" ], m.mixins.reset("flex"));
-        var we = y().div.withConfig({
+        })([ "", ";flex-direction:row;" ], S.mixins.reset("flex"));
+        var xe = w().div.withConfig({
             displayName: "ColorStyles__StyledPaletteInputWrapper",
             componentId: "jxrost-1"
-        })([ "display:flex;min-width:0;gap:", ";" ], m.variables.spacingSmall);
-        var Ce = y()(he).withConfig({
+        })([ "display:flex;min-width:0;gap:", ";" ], S.variables.spacingSmall);
+        var ke = w()(Ce).withConfig({
             displayName: "ColorStyles__StyledColorInput",
             componentId: "jxrost-2"
         })([ "flex-grow:0;&:focus-within{z-index:1;}" ]);
         // CONCATENATED MODULE: external "@splunk/react-ui/Divider"
-        const Se = require("@splunk/react-ui/Divider");
-        var xe =  n.n(Se);
+        const je = require("@splunk/react-ui/Divider");
+        var Ee =  t.n(je);
         // CONCATENATED MODULE: ./src/Color/PaletteStyles.ts
-        var ke = 5;
-        var Oe = y().div.withConfig({
+        var Ie = 5;
+        var Pe = w().div.withConfig({
             displayName: "PaletteStyles__StyledPalette",
             componentId: "qgv9v9-0"
-        })([ "padding:", " ", ";" ], m.variables.spacingMedium, m.variables.spacingLarge);
-        var Ee = y().ul.withConfig({
+        })([ "padding:", " ", ";" ], S.variables.spacingMedium, S.variables.spacingLarge);
+        var _e = w().ul.withConfig({
             displayName: "PaletteStyles__StyledSwatches",
             componentId: "qgv9v9-1"
-        })([ "", ";grid-template-columns:repeat(", ",", ");gap:", ";" ], m.mixins.reset("grid"), ke, m.variables.inputHeight, m.variables.spacingSmall);
-        var Ie = y().li.withConfig({
+        })([ "", ";grid-template-columns:repeat(", ",", ");gap:", ";" ], S.mixins.reset("grid"), Ie, S.variables.inputHeight, S.variables.spacingSmall);
+        var qe = w().li.withConfig({
             displayName: "PaletteStyles__StyledSwatch",
             componentId: "qgv9v9-2"
-        })([ "", ";" ], m.mixins.reset("inline-block"));
-        var _e = y().div.withConfig({
+        })([ "", ";" ], S.mixins.reset("inline-block"));
+        var Be = w().div.withConfig({
             displayName: "PaletteStyles__StyledToolBar",
             componentId: "qgv9v9-3"
-        })([ "position:relative;display:flex;align-items:center;gap:", ";" ], m.variables.spacingSmall);
-        var je = y()(xe()).withConfig({
+        })([ "position:relative;display:flex;align-items:center;gap:", ";" ], S.variables.spacingSmall);
+        var Re = w()(Ee()).withConfig({
             displayName: "PaletteStyles__StyledDivider",
             componentId: "qgv9v9-4"
-        })([ "margin-block:", ";" ], m.variables.spacingSmall);
+        })([ "margin-block:", ";" ], S.variables.spacingSmall);
         // CONCATENATED MODULE: ./src/Color/Palette.tsx
-        function Pe(e, r) {
+        function Ae(e, r) {
             if (null == e) return {};
-            var n, t, a = qe(e, r);
+            var t, n, a = Te(e, r);
             if (Object.getOwnPropertySymbols) {
-                var l = Object.getOwnPropertySymbols(e);
-                for (t = 0; t < l.length; t++) {
-                    n = l[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (a[n] = e[n]);
+                var o = Object.getOwnPropertySymbols(e);
+                for (n = 0; n < o.length; n++) {
+                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
         }
-        function qe(e, r) {
+        function Te(e, r) {
             if (null == e) return {};
-            var n = {};
-            for (var t in e) {
-                if ({}.hasOwnProperty.call(e, t)) {
-                    if (r.includes(t)) continue;
-                    n[t] = e[t];
+            var t = {};
+            for (var n in e) {
+                if ({}.hasOwnProperty.call(e, n)) {
+                    if (r.includes(n)) continue;
+                    t[n] = e[n];
                 }
             }
-            return n;
+            return t;
         }
-        var Be = [ "#7B56DB", "#009CEB", "#00CDAF", "#DD9900", "#FF677B", "#CB2196", "#813193", "#0051B5", "#008C80", "#99B100", "#FFA476", "#FF6ACE", "#AE8CFF", "#00689D", "#00490A", "#465D00", "#9D6300", "#F6540B", "#FF969E", "#E47BFE" ];
-        var Re = function e(r, n) {
-            return n != null && (r === null || r === void 0 ? void 0 : r.includes(n));
+        var $e = [ "#7B56DB", "#009CEB", "#00CDAF", "#DD9900", "#FF677B", "#CB2196", "#813193", "#0051B5", "#008C80", "#99B100", "#FFA476", "#FF6ACE", "#AE8CFF", "#00689D", "#00490A", "#465D00", "#9D6300", "#F6540B", "#FF969E", "#E47BFE" ];
+        var De = function e(r, t) {
+            return t != null && (r === null || r === void 0 ? void 0 : r.includes(t));
         };
-        var $e = [ null, "#ffffff", "#000000" ];
-        function Te(n) {
-            var t = n.activeInputRef, a = n.disabled, l = n.onChange, o = n.palette, i = o === void 0 ? Be : o, u = n.value, s = Pe(n, [ "activeInputRef", "disabled", "onChange", "palette", "value" ]);
+        var Ne = [ null, "#ffffff", "#000000" ];
+        function He(t) {
+            var n = t.activeInputRef, a = t.disabled, o = t.onChange, l = t.palette, i = l === void 0 ? $e : l, u = t.value, s = Ae(t, [ "activeInputRef", "disabled", "onChange", "palette", "value" ]);
             var c = (0, e.useMemo)((function() {
                 return i === null || i === void 0 ? void 0 : i.map((function(e) {
                     return e === null ? e : e.toLowerCase();
@@ -778,116 +784,179 @@
             }), [ i ]);
             var d = u != null ? u.toLowerCase() : u;
             var f = (0, e.useMemo)((function() {
-                return Re(c, d);
+                return De(c, d);
             }), [ c, d ]);
-            var v = (0, e.useMemo)((function() {
-                return Re($e, d);
+            var p = (0, e.useMemo)((function() {
+                return De(Ne, d);
             }), [ d ]);
-            var p = !f && !v && d !== "";
+            var v = !f && !p && d !== "";
             var b = (0, e.useMemo)((function() {
                 return c.some((function(e) {
-                    return e !== null && e.toLowerCase() === G;
+                    return e !== null && e.toLowerCase() === Y;
                 }));
             }), [ c ]);
             var y = (0, e.useCallback)((function(e, r) {
-                var n = r.value;
-                l(e, {
-                    value: n
+                var t = r.value;
+                o(e, {
+                    value: t
                 });
-            }), [ l ]);
+            }), [ o ]);
             var m = c.map((function(e) {
-                var n = e === null ? null : e.toLowerCase();
-                var l = n === d;
+                var t = e === null ? null : e.toLowerCase();
+                var o = t === d;
                 
-                return r().createElement(Ie, {
-                    key: n || "null"
-                },  r().createElement(ae, {
-                    value: n,
-                    ref: l ? t : null,
+                return r().createElement(qe, {
+                    key: t || "null"
+                },  r().createElement(ue, {
+                    value: t,
+                    ref: o ? n : null,
                     onClick: y,
-                    showSelected: l,
+                    showSelected: o,
                     disabled: a
                 }));
             }));
-            var h =  r().createElement(_e, {
+            var h =  r().createElement(Be, {
                 "data-test": "tool-bar"
-            }, $e.map((function(e) {
+            }, Ne.map((function(e) {
                 
-                return r().createElement(ae, {
+                return r().createElement(ue, {
                     key: e,
                     disabled: a,
                     onClick: y,
-                    ref: d === e ? t : null,
+                    ref: d === e ? n : null,
                     showSelected: d === e,
                     value: e
                 });
             })));
             
-            return r().createElement(Oe, s, m.length > 0 &&  r().createElement(r().Fragment, null,  r().createElement(Ee, null, m),  r().createElement(je, {
+            return r().createElement(Pe, s, m.length > 0 &&  r().createElement(r().Fragment, null,  r().createElement(_e, null, m),  r().createElement(Re, {
                 appearance: "weak"
-            })), h,  r().createElement(je, {
+            })), h,  r().createElement(Re, {
                 appearance: "weak"
-            }),  r().createElement(we, null,  r().createElement(he, {
+            }),  r().createElement(xe, null,  r().createElement(Ce, {
                 allowTransparent: b,
                 disabled: a,
-                inputRef: p ? t : null,
+                inputRef: v ? n : null,
                 onChange: y,
                 showPicker: true,
                 showSubmitButton: true,
                 value: d,
-                valueIsCustom: p
+                valueIsCustom: v
             })));
         }
-        /* harmony default export */        const Ae = Te;
+        /* harmony default export */        const Fe = He;
         // EXTERNAL MODULE: ./src/ScreenReaderContent/index.ts + 2 modules
-                var Ne = n(6165);
+                var Me = t(6165);
         // CONCATENATED MODULE: ./src/Color/Color.tsx
-        function He() {
-            return He = Object.assign ? Object.assign.bind() : function(e) {
+        function Le(e) {
+            "@babel/helpers - typeof";
+            return Le = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
+                return typeof e;
+            } : function(e) {
+                return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
+            }, Le(e);
+        }
+        function ze(e) {
+            return Ke(e) || We(e) || rr(e) || Ve();
+        }
+        function Ve() {
+            throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+        }
+        function We(e) {
+            if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
+        }
+        function Ke(e) {
+            if (Array.isArray(e)) return tr(e);
+        }
+        function Ue() {
+            return Ue = Object.assign ? Object.assign.bind() : function(e) {
                 for (var r = 1; r < arguments.length; r++) {
-                    var n = arguments[r];
-                    for (var t in n) {
-                        ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+                    var t = arguments[r];
+                    for (var n in t) {
+                        ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
                     }
                 }
                 return e;
-            }, He.apply(null, arguments);
+            }, Ue.apply(null, arguments);
+        }
+        function Ge(e, r) {
+            var t = Object.keys(e);
+            if (Object.getOwnPropertySymbols) {
+                var n = Object.getOwnPropertySymbols(e);
+                r && (n = n.filter((function(r) {
+                    return Object.getOwnPropertyDescriptor(e, r).enumerable;
+                }))), t.push.apply(t, n);
+            }
+            return t;
+        }
+        function Je(e) {
+            for (var r = 1; r < arguments.length; r++) {
+                var t = null != arguments[r] ? arguments[r] : {};
+                r % 2 ? Ge(Object(t), !0).forEach((function(r) {
+                    Qe(e, r, t[r]);
+                })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : Ge(Object(t)).forEach((function(r) {
+                    Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+                }));
+            }
+            return e;
         }
-        function De(e, r) {
-            return Ve(e) || ze(e, r) || Me(e, r) || Fe();
+        function Qe(e, r, t) {
+            return (r = Xe(r)) in e ? Object.defineProperty(e, r, {
+                value: t,
+                enumerable: !0,
+                configurable: !0,
+                writable: !0
+            }) : e[r] = t, e;
         }
-        function Fe() {
+        function Xe(e) {
+            var r = Ye(e, "string");
+            return "symbol" == Le(r) ? r : r + "";
+        }
+        function Ye(e, r) {
+            if ("object" != Le(e) || !e) return e;
+            var t = e[Symbol.toPrimitive];
+            if (void 0 !== t) {
+                var n = t.call(e, r || "default");
+                if ("object" != Le(n)) return n;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return ("string" === r ? String : Number)(e);
+        }
+        function Ze(e, r) {
+            return ar(e) || nr(e, r) || rr(e, r) || er();
+        }
+        function er() {
             throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
         }
-        function Me(e, r) {
+        function rr(e, r) {
             if (e) {
-                if ("string" == typeof e) return Le(e, r);
-                var n = {}.toString.call(e).slice(8, -1);
-                return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? Le(e, r) : void 0;
+                if ("string" == typeof e) return tr(e, r);
+                var t = {}.toString.call(e).slice(8, -1);
+                return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? tr(e, r) : void 0;
             }
         }
-        function Le(e, r) {
+        function tr(e, r) {
             (null == r || r > e.length) && (r = e.length);
-            for (var n = 0, t = Array(r); n < r; n++) {
-                t[n] = e[n];
+            for (var t = 0, n = Array(r); t < r; t++) {
+                n[t] = e[t];
             }
-            return t;
+            return n;
         }
-        function ze(e, r) {
-            var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-            if (null != n) {
-                var t, a, l, o, i = [], u = !0, s = !1;
+        function nr(e, r) {
+            var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+            if (null != t) {
+                var n, a, o, l, i = [], u = !0, s = !1;
                 try {
-                    if (l = (n = n.call(e)).next, 0 === r) {
-                        if (Object(n) !== n) return;
+                    if (o = (t = t.call(e)).next, 0 === r) {
+                        if (Object(t) !== t) return;
                         u = !1;
-                    } else for (;!(u = (t = l.call(n)).done) && (i.push(t.value), i.length !== r); u = !0) {
+                    } else for (;!(u = (n = o.call(t)).done) && (i.push(n.value), i.length !== r); u = !0) {
                     }
                 } catch (e) {
                     s = !0, a = e;
                 } finally {
                     try {
-                        if (!u && null != n["return"] && (o = n["return"](), Object(o) !== o)) return;
+                        if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
                     } finally {
                         if (s) throw a;
                     }
@@ -895,176 +964,185 @@
                 return i;
             }
         }
-        function Ve(e) {
+        function ar(e) {
             if (Array.isArray(e)) return e;
         }
-        function We(e, r) {
+        function or(e, r) {
             if (null == e) return {};
-            var n, t, a = Ke(e, r);
+            var t, n, a = lr(e, r);
             if (Object.getOwnPropertySymbols) {
-                var l = Object.getOwnPropertySymbols(e);
-                for (t = 0; t < l.length; t++) {
-                    n = l[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (a[n] = e[n]);
+                var o = Object.getOwnPropertySymbols(e);
+                for (n = 0; n < o.length; n++) {
+                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
         }
-        function Ke(e, r) {
+        function lr(e, r) {
             if (null == e) return {};
-            var n = {};
-            for (var t in e) {
-                if ({}.hasOwnProperty.call(e, t)) {
-                    if (r.includes(t)) continue;
-                    n[t] = e[t];
+            var t = {};
+            for (var n in e) {
+                if ({}.hasOwnProperty.call(e, n)) {
+                    if (r.includes(n)) continue;
+                    t[n] = e[n];
                 }
             }
-            return n;
+            return t;
         }
-        /** @public */        var Ue = {
-            append: l().bool,
-            defaultValue: l().string,
-            describedBy: l().string,
-            disabled: l().bool,
-            elementRef: l().oneOfType([ l().func, l().object ]),
-            error: l().bool,
-            hideInput: l().bool,
-            labelledBy: l().string,
-            name: l().string,
-            onChange: l().func,
-            palette: l().array,
-            prepend: l().bool,
+        /** @public */        var ir = {
+            append: o().bool,
+            defaultValue: o().string,
+            describedBy: o().string,
+            disabled: o().bool,
+            elementRef: o().oneOfType([ o().func, o().object ]),
+            error: o().bool,
+            hideInput: o().bool,
+            labelledBy: o().string,
+            name: o().string,
+            onChange: o().func,
+            palette: o().array,
+            prepend: o().bool,
             /** @private */
-            required: l().bool,
-            value: l().string
+            required: o().bool,
+            value: o().string
         };
-        var Ge = [ "clickAway", "escapeKey", "offScreen", "toggleClick" ];
+        var ur = [ "clickAway", "escapeKey", "offScreen", "toggleClick" ];
         /*
  * When the dropdown opens:
  * 1. If palette contains the color and the color is selected, the dropdown focus the color.
  * 2. If palette doesn't contain the color, the custom color picker swatch is focused.
- */        function Je(n) {
-            var t = n.append, a = n.defaultValue, l = n.disabled, o = n.describedBy, u = n.elementRef, c = n.error, f = n.hideInput, b = n.labelledBy, y = n.name, m = n.onChange, h = n.palette, g = h === void 0 ? Be : h, w = n.prepend, C = n.required, S = n.value, x = We(n, [ "append", "defaultValue", "disabled", "describedBy", "elementRef", "error", "hideInput", "labelledBy", "name", "onChange", "palette", "prepend", "required", "value" ]);
+ */        function sr(t) {
+            var n = t.append, a = t.defaultValue, o = t.disabled, l = t.describedBy, u = t.elementRef, c = t.error, f = t.hideInput, v = t.labelledBy, y = t.name, g = t.onChange, w = t.palette, S = w === void 0 ? $e : w, C = t.prepend, O = t.required, x = t.value, k = or(t, [ "append", "defaultValue", "disabled", "describedBy", "elementRef", "error", "hideInput", "labelledBy", "name", "onChange", "palette", "prepend", "required", "value" ]);
             // @docs-props-type ColorPropsBase
-                        var k = (0, e.useMemo)((function() {
-                return g.some((function(e) {
-                    return e !== null && e.toLowerCase() === G;
+                        var j = (0, e.useMemo)((function() {
+                return S.some((function(e) {
+                    return e !== null && e.toLowerCase() === Y;
                 }));
-            }), [ g ]);
-            var O = d()({
+            }), [ S ]);
+            var E = b()({
                 componentName: "Color",
                 /* eslint-disable-next-line prefer-rest-params */
                 componentProps: arguments[0]
             });
-            var E = (0, e.useState)(a), I = De(E, 2), _ = I[0], j = I[1];
-            var P = (0, e.useState)(false), q = De(P, 2), B = q[0], R = q[1];
-            var $ = s()(B);
-            var T = (0, e.useState)((function() {
-                return (0, p.createDOMID)("swatch-reader-content");
-            })), A = De(T, 1), N = A[0];
-            var H = (0, e.useRef)(null);
-            var D = (0, e.useRef)(null);
+            var I = (0, e.useState)(a), P = Ze(I, 2), _ = P[0], q = P[1];
+            var B = (0, e.useState)(false), R = Ze(B, 2), A = R[0], T = R[1];
+            var $ = p()(A);
+            var D = (0, e.useState)((function() {
+                return (0, h.createDOMID)("swatch-reader-content");
+            })), N = Ze(D, 1), H = N[0];
+            var F = (0, e.useRef)(null);
+            var M = (0, e.useRef)(null);
             (0, e.useEffect)((function() {
-                if (B) {
+                if (A) {
                     var e, r;
-                    (e = D.current) === null || e === void 0 ? void 0 : (r = e.focus) === null || r === void 0 ? void 0 : r.call(e);
+                    (e = M.current) === null || e === void 0 ? void 0 : (r = e.focus) === null || r === void 0 ? void 0 : r.call(e);
                 } else if ($) {
-                    var n;
-                    H === null || H === void 0 ? void 0 : (n = H.current) === null || n === void 0 ? void 0 : n.focus();
+                    var t;
+                    F === null || F === void 0 ? void 0 : (t = F.current) === null || t === void 0 ? void 0 : t.focus();
                 }
-            }), [ B, $ ]);
-            var F = (0, e.useMemo)((function() {
-                return O ? S : _;
-            }), [ O, S, _ ]);
+            }), [ A, $ ]);
+            var L = (0, e.useMemo)((function() {
+                return E ? x : _;
+            }), [ E, x, _ ]);
             (0, e.useEffect)((function() {
                 if (false) {
                     var e;
                 }
             }), [ a ]);
-            var M = (0, e.useCallback)((function(e) {
-                var r = e !== F;
-                if (!O) {
-                    j(e);
+            var z = (0, e.useCallback)((function(e) {
+                var r = e !== L;
+                if (!E) {
+                    q(e);
                 }
                 if (r) {
-                    m === null || m === void 0 ? void 0 : m({
+                    g === null || g === void 0 ? void 0 : g({
                         value: e,
                         name: y
                     });
                 }
-            }), [ O, y, m, F ]);
-            var L = (0, e.useCallback)((function() {
-                R(false);
+            }), [ E, y, g, L ]);
+            var V = (0, e.useCallback)((function() {
+                T(false);
             }), []);
-            var z = (0, e.useCallback)((function() {
-                R(true);
+            var W = (0, e.useCallback)((function() {
+                T(true);
             }), []);
-            var V = (0, e.useCallback)((function(e, r) {
-                var n = r.value;
+            var K = (0, e.useCallback)((function(e, r) {
+                var t = r.value;
                 e.preventDefault();
-                R(false);
-                M(n);
-            }), [ M ]);
-            var W = (0, e.useCallback)((function(e, r) {
-                var n = r.value;
-                R(false);
-                M(n);
-            }), [ M ]);
-            var K = function e() {
+                T(false);
+                z(t);
+            }), [ z ]);
+            var U = (0, e.useCallback)((function(e, r) {
+                var t = r.value;
+                T(false);
+                z(t);
+            }), [ z ]);
+            var G = function e() {
                 
-                return r().createElement(Ae, {
-                    activeInputRef: D,
-                    "aria-label": (0, v._)("Choose color"),
-                    disabled: l,
-                    onChange: V,
-                    palette: g,
+                return r().createElement(Fe, {
+                    activeInputRef: M,
+                    "aria-label": (0, m._)("Choose color"),
+                    disabled: o,
+                    onChange: K,
+                    palette: S,
                     role: "dialog",
-                    value: F
+                    value: L
                 });
             };
-            var U = function e() {
+            var J = (0, e.useMemo)((function() {
+                return Je(Je({}, s()(k, (function(e, r) {
+                    return r.indexOf("aria-") === 0;
+                }))), {}, {
+                    "aria-describedby": l,
+                    "aria-labelledby": v ? "".concat(v, " ").concat(H) : H,
+                    "aria-invalid": c || undefined
+                });
+            }), [ l, c, v, k, H ]);
+            var Q = function e() {
                 
-                return r().createElement(ae, He({
-                    append: !f ? true : t,
-                    "data-test": "color",
-                    "data-test-value": F,
-                    "aria-describedby": o,
-                    "aria-labelledby": b ? "".concat(b, " ").concat(N) : N,
-                    "aria-invalid": c || undefined,
-                    disabled: l,
+                return r().createElement(ue, Ue({
+                    append: !f ? true : n,
+                    "data-test": "toggle-swatch",
+                    "data-test-value": L
+                }, J, {
+                    disabled: o,
                     error: c,
-                    elementRef: u,
                     name: y,
-                    prepend: w,
-                    ref: H,
-                    value: F
-                }, x));
+                    prepend: C,
+                    ref: F,
+                    value: L
+                }));
             };
             
-            return r().createElement(ge, null,  r().createElement(Ne["default"], {
-                id: N
-            }, (0, v._)("Color picker")),  r().createElement(i(), {
-                closeReasons: Ge,
-                onRequestClose: L,
-                onRequestOpen: z,
-                open: B,
+            return r().createElement(Oe, Ue({
+                "data-test": "color",
+                ref: u
+            }, i()(k, ze(Object.keys(J)))),  r().createElement(Me["default"], {
+                id: H
+            }, (0, m._)("Color picker")),  r().createElement(d(), {
+                closeReasons: ur,
+                onRequestClose: V,
+                onRequestOpen: W,
+                open: A,
                 retainFocus: true,
                 takeFocus: false,
-                toggle: U()
-            }, K()), !f &&  r().createElement(Ce, {
-                allowTransparent: k,
-                append: t,
-                disabled: l,
-                labelledBy: b,
-                onChange: W,
+                toggle: Q()
+            }, G()), !f &&  r().createElement(ke, {
+                allowTransparent: j,
+                append: n,
+                disabled: o,
+                labelledBy: v,
+                onChange: U,
                 prepend: true,
-                required: C,
-                value: F
+                required: O,
+                value: L
             }));
         }
-        Je.propTypes = Ue;
-        Je.componentType = "Color";
-        /* harmony default export */        const Qe = Je;
+        sr.propTypes = ir;
+        sr.componentType = "Color";
+        /* harmony default export */        const cr = sr;
     }) // CONCATENATED MODULE: ./src/Color/index.ts
     ();
-    module.exports = t;
+    module.exports = n;
     /******/})();