@splunk/react-ui 4.30.0 → 4.32.0

package/ButtonSimple.js

@@ -9,26 +9,26 @@
     /******/    (() => {
         /******/ // getDefaultExport function for compatibility with non-harmony modules
         /******/ r.n = e => {
-            /******/ var o = e && e.__esModule ? 
+            /******/ var a = e && e.__esModule ? 
             /******/ () => e["default"]
             /******/ : () => e
             /******/;
-            r.d(o, {
-                a: o
+            r.d(a, {
+                a
             });
-            /******/            return o;
+            /******/            return a;
             /******/        };
         /******/    })();
     /******/
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ r.d = (e, o) => {
-            /******/ for (var a in o) {
-                /******/ if (r.o(o, a) && !r.o(e, a)) {
-                    /******/ Object.defineProperty(e, a, {
+        /******/ r.d = (e, a) => {
+            /******/ for (var o in a) {
+                /******/ if (r.o(a, o) && !r.o(e, o)) {
+                    /******/ Object.defineProperty(e, o, {
                         enumerable: true,
-                        get: o[a]
+                        get: a[o]
                     });
                     /******/                }
                 /******/            }
@@ -61,11 +61,11 @@
         r.r(e);
     // EXPORTS
         r.d(e, {
-        default: () => /* reexport */ Z
+        default: () => /* reexport */ lr
     });
     // CONCATENATED MODULE: external "react"
-    const o = require("react");
-    var a =  r.n(o);
+    const a = require("react");
+    var o =  r.n(a);
     // CONCATENATED MODULE: external "prop-types"
     const i = require("prop-types");
     var t =  r.n(i);
@@ -78,81 +78,272 @@
     var c =  r.n(s);
     // CONCATENATED MODULE: external "styled-components"
     const d = require("styled-components");
-    var b =  r.n(d);
+    var v =  r.n(d);
     // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
-    const v = require("@splunk/react-ui/Clickable");
-    var u =  r.n(v);
+    const b = require("@splunk/react-ui/Clickable");
+    var u =  r.n(b);
+    // CONCATENATED MODULE: external "lodash/merge"
+    const p = require("lodash/merge");
+    var f =  r.n(p);
+    // CONCATENATED MODULE: ./src/ButtonSimple/mixin.ts
+    function g(r) {
+        "@babel/helpers - typeof";
+        if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+            g = function r(e) {
+                return typeof e;
+            };
+        } else {
+            g = function r(e) {
+                return e && typeof Symbol === "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
+            };
+        }
+        return g(r);
+    }
+    var y = [ "primary", "secondary", "destructive", "ghost" ];
+    /**
+ * These enterprise... values don't exist in Enterprise @splunk/themes
+ * They're provided here for TypeScript compatibility
+ */    var k = {
+        active: {
+            dark: "rgba(0, 0, 0, 0.2)",
+            light: "rgba(0, 0, 0, 0.07)"
+        },
+        hover: {
+            dark: "rgba(255, 255, 255, 0.05)",
+            light: "rgba(0, 0, 0, 0.03)"
+        },
+        selected: {
+            dark: "rgba(255, 255, 255, 0.1)",
+            light: "rgba(0, 0, 0, 0.04)"
+        }
+    };
+    var h = {
+        dark: "#272a2f",
+        light: "#eeeeee"
+    };
+    var m = {
+        dark: "rgba(255, 255, 255, 0.15)",
+        light: "rgba(0, 0, 0, 0.1)"
+    };
+    function C(r) {
+        var e = "transparent";
+        var a = "transparent";
+        var o = (0, n.pick)({
+            enterprise: m,
+            prisma: n.variables.interactiveColorBackgroundDisabled
+        });
+        var i = (0, n.pick)({
+            enterprise: {
+                dark: n.mixins.overlayColors(m.dark, k.selected.dark),
+                light: n.mixins.overlayColors(m.light, k.selected.light)
+            },
+            prisma: n.mixins.overlayColors(n.variables.interactiveColorBackgroundDisabled, n.variables.interactiveColorOverlaySelected)
+        });
+        var t = "transparent";
+        var l = "transparent";
+        var s;
+        var c;
+        var d = n.variables.contentColorActive;
+        var v = n.variables.contentColorDisabled;
+        switch (r) {
+          case "primary":
+            {
+                e = n.variables.interactiveColorPrimary;
+                a = (0, n.pick)({
+                    enterprise: {
+                        light: n.mixins.overlayColors(n.variables.interactiveColorPrimary, k.active.light),
+                        dark: n.mixins.overlayColors(n.variables.interactiveColorPrimary, k.active.dark)
+                    },
+                    prisma: n.mixins.overlayColors(n.variables.interactiveColorPrimary, n.variables.interactiveColorOverlayActive)
+                });
+                t = (0, n.pick)({
+                    enterprise: {
+                        light: n.mixins.overlayColors(n.variables.interactiveColorPrimary, k.hover.light),
+                        dark: n.mixins.overlayColors(n.variables.interactiveColorPrimary, k.hover.dark)
+                    },
+                    prisma: n.mixins.overlayColors(n.variables.interactiveColorPrimary, n.variables.interactiveColorOverlayHover)
+                });
+                l = (0, n.pick)({
+                    enterprise: {
+                        light: n.mixins.overlayColors(n.variables.interactiveColorPrimary, k.selected.light),
+                        dark: n.mixins.overlayColors(n.variables.interactiveColorPrimary, k.selected.dark)
+                    },
+                    prisma: n.mixins.overlayColors(n.variables.interactiveColorPrimary, n.variables.interactiveColorOverlaySelected)
+                });
+                d = n.variables.contentColorInverted;
+                break;
+            }
+
+          case "destructive":
+            {
+                e = n.variables.accentColorNegative;
+                a = (0, n.pick)({
+                    enterprise: {
+                        light: n.mixins.overlayColors(n.variables.accentColorNegative, k.active.light),
+                        dark: n.mixins.overlayColors(n.variables.accentColorNegative, k.active.dark)
+                    },
+                    prisma: n.mixins.overlayColors(n.variables.accentColorNegative, n.variables.interactiveColorOverlayActive)
+                });
+                t = (0, n.pick)({
+                    enterprise: {
+                        light: n.mixins.overlayColors(n.variables.accentColorNegative, k.hover.light),
+                        dark: n.mixins.overlayColors(n.variables.accentColorNegative, k.hover.dark)
+                    },
+                    prisma: n.mixins.overlayColors(n.variables.accentColorNegative, n.variables.interactiveColorOverlayHover)
+                });
+                l = (0, n.pick)({
+                    enterprise: {
+                        light: n.mixins.overlayColors(n.variables.accentColorNegative, k.selected.light),
+                        dark: n.mixins.overlayColors(n.variables.accentColorNegative, k.selected.dark)
+                    },
+                    prisma: n.mixins.overlayColors(n.variables.accentColorNegative, n.variables.interactiveColorOverlaySelected)
+                });
+                d = n.variables.contentColorInverted;
+                break;
+            }
+
+          case "secondary":
+            s = n.variables.interactiveColorBorder;
+            c = n.variables.interactiveColorBorderDisabled;
+            e = (0, n.pick)({
+                enterprise: h,
+                prisma: n.variables.interactiveColorBackground
+            });
+            a = (0, n.pick)({
+                enterprise: k.active,
+                prisma: n.variables.interactiveColorOverlayActive
+            });
+            t = (0, n.pick)({
+                enterprise: k.hover,
+                prisma: n.variables.interactiveColorOverlayHover
+            });
+            l = (0, n.pick)({
+                enterprise: k.selected,
+                prisma: n.variables.interactiveColorOverlaySelected
+            });
+            break;
+
+          case "ghost":
+            a = (0, n.pick)({
+                enterprise: k.active,
+                prisma: n.variables.interactiveColorOverlayActive
+            });
+            t = (0, n.pick)({
+                enterprise: k.hover,
+                prisma: n.variables.interactiveColorOverlayHover
+            });
+            l = (0, n.pick)({
+                enterprise: k.selected,
+                prisma: n.variables.interactiveColorOverlaySelected
+            });
+            break;
+
+          default:
+        }
+        var b = {
+            background: e,
+            backgroundActive: a,
+            backgroundDisabled: o,
+            backgroundDisabledSelected: i,
+            backgroundHover: t,
+            backgroundSelected: l,
+            borderColor: s,
+            borderColorDisabled: c,
+            color: d,
+            colorDisabled: v
+        };
+        return b;
+    }
+    function x(r, e) {
+        var a = typeof r === "string" && y.includes(r) ? r : undefined;
+        var o = {};
+        if (a && e !== undefined) {
+            o = e;
+        } else if (a === undefined && g(r) === "object" && e === undefined) {
+            o = r;
+        }
+        var i = C(a);
+        var t = f()(i, o), l = t.background, s = t.backgroundActive, c = t.backgroundDisabled, v = t.backgroundDisabledSelected, b = t.backgroundHover, u = t.backgroundSelected, p = t.borderColor, k = t.borderColorDisabled, h = t.color, m = t.colorDisabled;
+        var x = l != null && l !== "transparent";
+        return function() {
+            return (0, d.css)([ "border-radius:", ";", ";", " ", " cursor:pointer;position:relative;&:focus,&:hover{z-index:3;}&:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";transition:background-color 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";}&:active{background-color:", ";transition:none;}", "}&:focus{box-shadow:", ";}&[disabled],&[aria-disabled='true']{border-color:", ";color:", ";cursor:not-allowed;", "}" ], n.variables.borderRadius, (function() {
+                return p && (0, d.css)([ "border:1px solid ", ";" ], p);
+            }), (function(r) {
+                var e = r.$append;
+                return e && (0, d.css)([ "border-top-right-radius:0.1px;border-bottom-right-radius:0.1px;border-right:none;" ]);
+            }), (function(r) {
+                var e = r.$prepend;
+                return e && (0, d.css)([ "border-top-left-radius:0.1px;border-bottom-left-radius:0.1px;" ]);
+            }), l, h, b, s, (function(r) {
+                var e = r.$selected;
+                return e && (0, d.css)([ "background-color:", ";" ], u);
+            }), n.variables.focusShadow, k, m, (function(r) {
+                return x && (0, d.css)([ "background-color:", ";" ], r ? v
+                /* TODO: this isn't defined in SUI 5 themes yet */ : c);
+            }));
+        };
+    }
+    /* harmony default export */    const w = x;
     // CONCATENATED MODULE: ./src/ButtonSimple/prismaStyles.ts
-    var p = (0, d.css)([ "", " cursor:pointer;position:relative;border-radius:", ";&:focus,&:hover{z-index:3;}" ], n.mixins.reset("block"), n.variables.borderRadius);
-    /* Setting border-radius to 0.1px creates a rounded shadow, */    var f = (0, d.css)([ "", " ", "" ], (function(r) {
-        var e = r.$append;
-        return e && (0, d.css)([ "border-top-right-radius:0.1px;border-bottom-right-radius:0.1px;border-right:none;" ]);
-    }), (function(r) {
-        var e = r.$prepend;
-        return e && (0, d.css)([ "border-top-left-radius:0.1px;border-bottom-left-radius:0.1px;" ]);
-    }));
-    var g = (0, d.css)([ "", " ", " ", " &:not([disabled],[aria-disabled='true']){color:", ";transition:background-color 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";border-color:", ";", "}", " ", " &:active{background-color:", ";transition:none;}&:focus{background-color:", ";&:active{background-color:", ";}}}&[disabled],&[aria-disabled='true']{border-color:", ";color:", ";cursor:not-allowed;", "}&:not([disabled]){&:focus{box-shadow:", ";}}" ], p, (0, 
+    var S = (0, d.css)([ "", " &:not([disabled],[aria-disabled='true']){&:focus{background-color:", ";}&:hover{border-color:", ";", "}", " ", "}&[disabled],&[aria-disabled='true']{", "}" ], (0, 
     n.pickVariant)("$variant", {
-        prismaSecondary: (0, d.css)([ "font-weight:", ";" ], n.variables.fontWeightSemiBold),
-        prismaDefault: (0, d.css)([ "border:1px solid ", ";font-weight:", ";" ], n.variables.interactiveColorBorder, n.variables.fontWeightSemiBold),
-        prismaToggle: (0, d.css)([ "border:1px solid ", ";font-weight:normal;" ], n.variables.interactiveColorBorder)
-    }), f, n.variables.contentColorActive, n.variables.interactiveColorOverlayHover, n.variables.interactiveColorBorderHover, (0, 
+        prismaSecondary: (0, d.css)([ "", " font-weight:", ";" ], w("ghost"), n.variables.fontWeightSemiBold),
+        prismaDefault: (0, d.css)([ "", " font-weight:", ";" ], w("secondary", {
+            background: "transparent"
+        }), n.variables.fontWeightSemiBold),
+        prismaToggle: (0, d.css)([ "", " font-weight:normal;" ], w("secondary", {
+            background: "transparent"
+        }))
+    }), n.variables.interactiveColorOverlayHover, n.variables.interactiveColorBorderHover, (0, 
     n.pickVariant)("$variant", {
         prismaSecondary: (0, d.css)([ "box-shadow:", ";" ], n.variables.hoverShadow),
         prismaDefault: (0, d.css)([ "box-shadow:", ";" ], n.variables.hoverShadow)
     }), (function(r) {
         var e = r.$selected;
-        return e && (0, d.css)([ "background-color:", ";border-color:", ";&:hover{background-color:", ";}" ], n.variables.interactiveColorOverlaySelected, n.variables.interactiveColorBorderDisabled, n.mixins.overlayColors(n.variables.interactiveColorOverlaySelected, n.variables.interactiveColorOverlayHover));
+        return e && (0, d.css)([ "border-color:", ";&:hover{background-color:", ";}" ], n.variables.interactiveColorBorderDisabled, n.mixins.overlayColors(n.variables.interactiveColorOverlaySelected, n.variables.interactiveColorOverlayHover));
     }), (function(r) {
         var e = r.$error;
         return e && (0, d.css)([ "border-color:", ";&:hover{border-color:", ";}" ], n.variables.accentColorNegative, n.variables.accentColorNegative);
-    }), n.variables.interactiveColorOverlayActive, n.variables.interactiveColorOverlayHover, n.variables.interactiveColorOverlayActive, n.variables.interactiveColorBorderDisabled, n.variables.contentColorDisabled, (function(r) {
+    }), (function(r) {
         var e = r.$selected;
         return e && (0, d.css)([ "background-color:", ";" ], n.mixins.overlayColors(n.variables.interactiveColorBackgroundDisabled, n.variables.interactiveColorOverlaySelected));
-    }), n.variables.focusShadow);
-    var y = (0, d.css)([ "&[disabled],&[aria-disabled='true']{border-color:", ";color:", ";background-color:", ";cursor:not-allowed;", "}" ], n.variables.interactiveColorBorderDisabled, n.variables.contentColorDisabled, n.variables.interactiveColorBackgroundDisabled, (function(r) {
-        return r && (0, d.css)([ "background-color:", ";" ], n.mixins.overlayColors(n.variables.interactiveColorBackgroundDisabled, n.variables.interactiveColorOverlaySelected));
     }));
-    var h = (0, d.css)([ "", " font-weight:", ";border-radius:", ";", " &:not([disabled],[aria-disabled='true']){color:", ";transition:background-color 0.2s,box-shadow 0.2s,text-decoration 0.2s;background-color:", ";&:hover,&:focus{background-color:", ";}&:hover{box-shadow:", ";}&:active{background-color:", ";transition:none;}}&:not([disabled]){&:focus{box-shadow:", ";}}", "" ], p, n.variables.fontWeightSemiBold, n.variables.borderRadius, f, n.variables.contentColorInverted, (0, 
-    n.pickVariant)("$selected", {
-        false: (0, n.pickVariant)("$variant", {
-            prismaPrimary: n.variables.interactiveColorPrimary,
-            prismaDestructive: n.variables.accentColorNegative
-        }),
-        true: (0, n.pickVariant)("$variant", {
-            prismaPrimary: n.mixins.overlayColors(n.variables.interactiveColorPrimary, n.variables.interactiveColorOverlaySelected),
-            prismaDestructive: n.mixins.overlayColors(n.variables.accentColorNegative, n.variables.interactiveColorOverlaySelected)
-        })
-    }), (0, n.pickVariant)("$variant", {
+    var O = (0, d.css)([ "", " font-weight:", ";&:focus{background-color:", ";}&:hover{box-shadow:", ";}" ], (0, 
+    n.pickVariant)("$variant", {
+        prismaPrimary: w("primary"),
+        prismaDestructive: w("destructive")
+    }), n.variables.fontWeightSemiBold, (0, n.pickVariant)("$variant", {
         prismaPrimary: n.mixins.overlayColors(n.variables.interactiveColorPrimary, n.variables.interactiveColorOverlayHover),
         prismaDestructive: n.mixins.overlayColors(n.variables.accentColorNegative, n.variables.interactiveColorOverlayHover)
-    }), n.variables.hoverShadow, (0, n.pickVariant)("$variant", {
-        prismaPrimary: n.mixins.overlayColors(n.variables.interactiveColorPrimary, n.variables.interactiveColorOverlayActive),
-        prismaDestructive: n.mixins.overlayColors(n.variables.accentColorNegative, n.variables.interactiveColorOverlayActive)
-    }), n.variables.focusShadow, y);
-    var k = (0, d.css)([ "", " font-weight:", ";border-radius:", ";", " &:not([disabled],[aria-disabled='true']){color:", ";background-color:", ";transition:background-color 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " &:hover{background-color:", ";box-shadow:", ";}&:active{background-color:", ";transition:none;}&:focus{background-color:", ";}}&:not([disabled]){&:focus{box-shadow:", ";}}", "" ], p, n.variables.fontWeightSemiBold, n.variables.borderRadius, f, n.variables.contentColorActive, n.variables.interactiveColorBackground, (function(r) {
-        return r && (0, d.css)([ "background-color:", ";" ], n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlaySelected));
-    }), n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlayHover), n.variables.hoverShadow, n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlayActive), n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlayHover), n.variables.focusShadow, y);
+    }), n.variables.hoverShadow);
+    var D = (0, d.css)([ "", " font-weight:", ";&:hover{box-shadow:", ";}&:focus{background-color:", ";}" ], w({
+        // this is intentional - the background had always been applying the $selected style
+        // since beccfde78f787861217353e9149ce213bee0270 so keeping this for visual consistency
+        background: n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlaySelected),
+        backgroundActive: n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlayActive),
+        backgroundHover: n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlayHover),
+        backgroundSelected: n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlaySelected)
+    }), n.variables.fontWeightSemiBold, n.variables.hoverShadow, n.mixins.overlayColors(n.variables.interactiveColorBackground, n.variables.interactiveColorOverlayHover));
     // CONCATENATED MODULE: ./src/ButtonSimple/enterpriseStyles.ts
-    var m = "#1A8929";
+    var P = "#1A8929";
  // SUI-2439 to meet WCAG AA compliance
-        var C = "#235823";
+        var $ = "#235823";
  // SUI-2439 to meet WCAG AA compliance
-        var x = (0, d.css)([ "", " border-radius:", ";cursor:pointer;position:relative;&:focus{z-index:3;}" ], n.mixins.reset("block"), n.variables.borderRadius);
-    var w = (0, d.css)([ "", " ", "" ], (function(r) {
+        var j = (0, d.css)([ "border-radius:", ";cursor:pointer;position:relative;&:focus{z-index:3;}" ], n.variables.borderRadius);
+    var B = (0, d.css)([ "", " ", "" ], (function(r) {
         var e = r.$append;
         return e && (0, d.css)([ "border-top-right-radius:0;border-bottom-right-radius:0;border-right:none;" ]);
     }), (function(r) {
         var e = r.$prepend;
         return e && (0, d.css)([ "border-top-left-radius:0;border-bottom-left-radius:0;" ]);
     }));
-    var S = "inset 0 -1px 0 rgba(0, 0, 0, 0.1)";
-    var O = "inset 0 1px 0 rgba(0, 0, 0, 0.1)";
-    var D = (0, d.css)([ "", ";border:", ";", ";font-weight:", ";&:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", ";", " &:hover{background-color:", ";box-shadow:", ";}&:active{transition:none;background-color:", ";border-color:", ";", ";}&:focus{", " ", "}}&:not([disabled]){&:focus{box-shadow:", ",", ";}}&[disabled],&[aria-disabled='true']{cursor:not-allowed;color:", ";background-color:", ";border-color:", ";", "}" ], x, (0, 
+    var N = "inset 0 -1px 0 rgba(0, 0, 0, 0.1)";
+    var T = "inset 0 1px 0 rgba(0, 0, 0, 0.1)";
+    var H = (0, d.css)([ "", ";border:", ";", ";font-weight:", ";&:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", ";", " &:hover{background-color:", ";box-shadow:", ";}&:active{transition:none;background-color:", ";border-color:", ";", ";}&:focus{", " ", "}}&:not([disabled]){&:focus{box-shadow:", ",", ";}}&[disabled],&[aria-disabled='true']{cursor:not-allowed;color:", ";background-color:", ";border-color:", ";", "}" ], j, (0, 
     n.pick)({
         light: (0, d.css)([ "1px solid ", "" ], n.variables.gray60),
         dark: n.variables.border
-    }), w, (0, n.pickVariant)("$variant", {
+    }), B, (0, n.pickVariant)("$variant", {
         enterpriseDefault: "normal",
         enterpriseSecondary: n.variables.fontWeightSemiBold
     }), (0, n.pick)({
@@ -162,13 +353,13 @@
         light: n.variables.gray45,
         dark: n.variables.white
     }), (0, n.pick)({
-        light: (0, d.css)([ "box-shadow:", ";" ], S),
+        light: (0, d.css)([ "box-shadow:", ";" ], N),
         dark: (0, d.css)([ "box-shadow:inset 0 -1px 0 ", ";" ], n.variables.gray30)
     }), (function(r) {
         var e = r.$selected;
         return e && (0, d.css)([ "box-shadow:", ";background-color:", ";border-color:", ";" ], (0, 
         n.pick)({
-            light: O,
+            light: T,
             dark: (0, d.css)([ "inset 0 1px 0 ", "" ], n.variables.black)
         }), (0, n.pick)({
             light: n.variables.gray92,
@@ -181,7 +372,7 @@
         light: "#ebeeef",
         dark: n.variables.gray30
     }), (0, n.pick)({
-        light: S,
+        light: N,
         dark: (0, d.css)([ "inset 0 -1px 0 ", "" ], n.variables.gray25)
     }), (0, n.pick)({
         light: n.variables.gray92,
@@ -194,17 +385,17 @@
     }), (function(r) {
         var e = r.$append;
         return e && (0, d.css)([ "box-shadow:", ",", ",inset -1px 0 0 ", ";" ], (0, n.pick)({
-            light: S,
+            light: N,
             dark: (0, d.css)([ "inset 0 -1px 0 ", "" ], n.variables.gray30)
         }), n.variables.focusShadow, n.variables.borderColor);
     }), (function(r) {
-        var e = r.$append, o = r.$selected;
-        return e && o && (0, n.pick)({
-            light: (0, d.css)([ "box-shadow:", ",", ",", ",inset -1px 0 0 ", ";" ], S, O, n.variables.focusShadow, n.variables.borderColor),
+        var e = r.$append, a = r.$selected;
+        return e && a && (0, n.pick)({
+            light: (0, d.css)([ "box-shadow:", ",", ",", ",inset -1px 0 0 ", ";" ], N, T, n.variables.focusShadow, n.variables.borderColor),
             dark: (0, d.css)([ "box-shadow:inset 0 1px 0 ", ",", ",inset -1px 0 0 ", ";" ], n.variables.black, n.variables.focusShadow, n.variables.borderColor)
         });
     }), (0, n.pick)({
-        light: S,
+        light: N,
         dark: (0, d.css)([ "inset 0 -1px 0 ", "" ], n.variables.gray30)
     }), n.variables.focusShadow, n.variables.textDisabledColor, (0, n.pick)({
         light: n.variables.gray96,
@@ -215,33 +406,33 @@
     }), (function(r) {
         var e = r.$selected;
         return e && (0, n.pick)({
-            light: (0, d.css)([ "box-shadow:", ";background-color:", ";border-color:", ";" ], O, n.variables.gray92, n.variables.gray80),
+            light: (0, d.css)([ "box-shadow:", ";background-color:", ";border-color:", ";" ], T, n.variables.gray92, n.variables.gray80),
             dark: (0, d.css)([ "box-shadow:inset 0 1px 0 ", ";background-color:", ";border-color:", ";" ], n.variables.black, n.variables.gray22, n.variables.gray20)
         });
     }));
-    var $ = "inset 0 -2px 0 rgba(0, 0, 0, 0.1)";
-    var P = "inset 0 2px 0 rgba(0, 0, 0, 0.1)";
-    var B = (0, d.css)([ "", ";font-weight:", ";", " &:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";box-shadow:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " ", " &:hover{background-color:", ";}&:active{background-color:", ";transition:none;}&:focus{&:active{background-color:", ";transition:none;}}}&:not([disabled]){&:focus{box-shadow:", ",", ";}}&[disabled],&[aria-disabled='true']{color:", ";background-color:", ";cursor:not-allowed;", "}" ], x, n.variables.fontWeightSemiBold, w, m, n.variables.white, $, (function(r) {
+    var _ = "inset 0 -2px 0 rgba(0, 0, 0, 0.1)";
+    var A = "inset 0 2px 0 rgba(0, 0, 0, 0.1)";
+    var R = (0, d.css)([ "", ";font-weight:", ";", " &:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";box-shadow:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " ", " &:hover{background-color:", ";}&:active{background-color:", ";transition:none;}&:focus{&:active{background-color:", ";transition:none;}}}&:not([disabled]){&:focus{box-shadow:", ",", ";}}&[disabled],&[aria-disabled='true']{color:", ";background-color:", ";cursor:not-allowed;", "}" ], j, n.variables.fontWeightSemiBold, B, P, n.variables.white, _, (function(r) {
         var e = r.$selected;
-        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], P, C);
+        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], A, $);
     }), (function(r) {
         var e = r.$prepend;
-        return e && (0, d.css)([ "border-left:1px solid ", ";" ], m);
-    }), n.variables.brandColorD50, n.variables.brandColorD30, n.variables.brandColorD30, $, n.variables.focusShadow, n.variables.brandColorL30, n.variables.brandColorL10, (function(r) {
+        return e && (0, d.css)([ "border-left:1px solid ", ";" ], P);
+    }), n.variables.brandColorD50, n.variables.brandColorD30, n.variables.brandColorD30, _, n.variables.focusShadow, n.variables.brandColorL30, n.variables.brandColorL10, (function(r) {
         var e = r.$selected;
-        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], P, n.variables.brandColorD20);
+        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], A, n.variables.brandColorD20);
     }));
-    var j = (0, d.css)([ "", ";font-weight:", ";", " &:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";box-shadow:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " ", " &:hover{background-color:", ";}&:active{background-color:", ";transition:none;}&:focus{&:active{background-color:", ";transition:none;}}}&:not([disabled]){&:focus{box-shadow:", ",", ";}}&[disabled],&[aria-disabled='true']{color:", ";background-color:", ";cursor:not-allowed;", "}" ], x, n.variables.fontWeightSemiBold, w, n.variables.errorColorD10, n.variables.white, $, (function(r) {
+    var E = (0, d.css)([ "", ";font-weight:", ";", " &:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";box-shadow:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " ", " &:hover{background-color:", ";}&:active{background-color:", ";transition:none;}&:focus{&:active{background-color:", ";transition:none;}}}&:not([disabled]){&:focus{box-shadow:", ",", ";}}&[disabled],&[aria-disabled='true']{color:", ";background-color:", ";cursor:not-allowed;", "}" ], j, n.variables.fontWeightSemiBold, B, n.variables.errorColorD10, n.variables.white, _, (function(r) {
         var e = r.$selected;
-        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], P, n.variables.errorColorD30);
+        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], A, n.variables.errorColorD30);
     }), (function(r) {
         var e = r.$prepend;
         return e && (0, d.css)([ "border-left:1px solid ", ";" ], n.variables.errorColorD30);
-    }), n.variables.errorColorD30, n.variables.errorColorD40, n.variables.errorColorD40, $, n.variables.focusShadow, n.variables.errorColorL10, n.variables.errorColorD10, (function(r) {
+    }), n.variables.errorColorD30, n.variables.errorColorD40, n.variables.errorColorD40, _, n.variables.focusShadow, n.variables.errorColorL10, n.variables.errorColorD10, (function(r) {
         var e = r.$selected;
-        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], P, n.variables.errorColorD40);
+        return e && (0, d.css)([ "box-shadow:", ";background-color:", ";" ], A, n.variables.errorColorD40);
     }));
-    var T = (0, d.css)([ "", ";color:", ";border:1px solid transparent;&:not([disabled],[aria-disabled='true']){transition:background-color 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " &:hover{color:", ";background-color:", ";border-color:", ";}", " &:focus{color:", ";}&:active,&[aria-expanded='true']{background-color:", ";transition:none;}}&:not([disabled]){&:focus{box-shadow:", ";}}&[disabled],&[aria-disabled='true']{color:", ";cursor:not-allowed;", "}" ], x, (0, 
+    var q = (0, d.css)([ "", ";color:", ";border:1px solid transparent;&:not([disabled],[aria-disabled='true']){transition:background-color 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " &:hover{color:", ";background-color:", ";border-color:", ";}", " &:focus{color:", ";}&:active,&[aria-expanded='true']{background-color:", ";transition:none;}}&:not([disabled]){&:focus{box-shadow:", ";}}&[disabled],&[aria-disabled='true']{color:", ";cursor:not-allowed;", "}" ], j, (0, 
     n.pick)({
         light: n.variables.gray45,
         dark: n.variables.white
@@ -268,98 +459,102 @@
         return e && (0, d.css)([ "border-color:", ";" ], n.variables.borderLightColor);
     }));
     // CONCATENATED MODULE: ./src/ButtonSimple/ButtonSimpleStyles.ts
-    var _ = b()(u()).withConfig({
+    var V = v()(u()).withConfig({
         displayName: "ButtonSimpleStyles__StyledClickable",
         componentId: "vlarwe-0"
-    })([ "", "" ], (0, n.pickVariant)("$variant", {
-        enterpriseDefault: D,
-        enterpriseSecondary: D,
-        enterprisePrimary: B,
-        enterpriseError: j,
-        enterpriseDestructive: j,
-        enterprisePill: T,
-        prismaDefault: g,
-        prismaDestructive: h,
-        prismaPrimary: h,
-        prismaSecondary: g,
-        prismaToggle: g,
-        prismaFlat: k
+    })([ "", " ", "" ], n.mixins.reset("block"), (0, n.pick)({
+        enterprise: (0, n.pickVariant)("$variant", {
+            enterpriseDefault: H,
+            enterpriseSecondary: H,
+            enterprisePrimary: R,
+            enterpriseError: E,
+            enterpriseDestructive: E,
+            enterprisePill: q
+        }),
+        prisma: (0, n.pickVariant)("$variant", {
+            prismaDefault: S,
+            prismaDestructive: O,
+            prismaPrimary: O,
+            prismaSecondary: S,
+            prismaToggle: S,
+            prismaFlat: D
+        })
     }));
     // CONCATENATED MODULE: ./src/ButtonSimple/ButtonSimple.tsx
-    function R(r) {
+    function W(r) {
         "@babel/helpers - typeof";
         if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-            R = function r(e) {
+            W = function r(e) {
                 return typeof e;
             };
         } else {
-            R = function r(e) {
+            W = function r(e) {
                 return e && typeof Symbol === "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
             };
         }
-        return R(r);
+        return W(r);
     }
-    function A() {
-        A = Object.assign || function(r) {
+    function I() {
+        I = Object.assign || function(r) {
             for (var e = 1; e < arguments.length; e++) {
-                var o = arguments[e];
-                for (var a in o) {
-                    if (Object.prototype.hasOwnProperty.call(o, a)) {
-                        r[a] = o[a];
+                var a = arguments[e];
+                for (var o in a) {
+                    if (Object.prototype.hasOwnProperty.call(a, o)) {
+                        r[o] = a[o];
                     }
                 }
             }
             return r;
         };
-        return A.apply(this, arguments);
+        return I.apply(this, arguments);
     }
-    function E(r, e) {
+    function L(r, e) {
         if (r == null) return {};
-        var o = H(r, e);
-        var a, i;
+        var a = M(r, e);
+        var o, i;
         if (Object.getOwnPropertySymbols) {
             var t = Object.getOwnPropertySymbols(r);
             for (i = 0; i < t.length; i++) {
-                a = t[i];
-                if (e.indexOf(a) >= 0) continue;
-                if (!Object.prototype.propertyIsEnumerable.call(r, a)) continue;
-                o[a] = r[a];
+                o = t[i];
+                if (e.indexOf(o) >= 0) continue;
+                if (!Object.prototype.propertyIsEnumerable.call(r, o)) continue;
+                a[o] = r[o];
             }
         }
-        return o;
+        return a;
     }
-    function H(r, e) {
+    function M(r, e) {
         if (r == null) return {};
-        var o = {};
-        var a = Object.keys(r);
+        var a = {};
+        var o = Object.keys(r);
         var i, t;
-        for (t = 0; t < a.length; t++) {
-            i = a[t];
+        for (t = 0; t < o.length; t++) {
+            i = o[t];
             if (e.indexOf(i) >= 0) continue;
-            o[i] = r[i];
+            a[i] = r[i];
         }
-        return o;
+        return a;
     }
-    function N(r, e) {
+    function z(r, e) {
         if (!(r instanceof e)) {
             throw new TypeError("Cannot call a class as a function");
         }
     }
-    function V(r, e) {
-        for (var o = 0; o < e.length; o++) {
-            var a = e[o];
-            a.enumerable = a.enumerable || false;
-            a.configurable = true;
-            if ("value" in a) a.writable = true;
-            Object.defineProperty(r, a.key, a);
+    function F(r, e) {
+        for (var a = 0; a < e.length; a++) {
+            var o = e[a];
+            o.enumerable = o.enumerable || false;
+            o.configurable = true;
+            if ("value" in o) o.writable = true;
+            Object.defineProperty(r, o.key, o);
         }
     }
-    function q(r, e, o) {
-        if (e) V(r.prototype, e);
-        if (o) V(r, o);
+    function G(r, e, a) {
+        if (e) F(r.prototype, e);
+        if (a) F(r, a);
         return r;
     }
-    function W(r, e) {
+    function J(r, e) {
         if (typeof e !== "function" && e !== null) {
             throw new TypeError("Super expression must either be null or a function");
         }
@@ -370,41 +565,41 @@
                 configurable: true
             }
         });
-        if (e) I(r, e);
+        if (e) K(r, e);
     }
-    function I(r, e) {
-        I = Object.setPrototypeOf || function r(e, o) {
-            e.__proto__ = o;
+    function K(r, e) {
+        K = Object.setPrototypeOf || function r(e, a) {
+            e.__proto__ = a;
             return e;
         };
-        return I(r, e);
+        return K(r, e);
     }
-    function L(r) {
-        var e = F();
-        return function o() {
-            var a = G(r), i;
+    function Q(r) {
+        var e = Y();
+        return function a() {
+            var o = Z(r), i;
             if (e) {
-                var t = G(this).constructor;
-                i = Reflect.construct(a, arguments, t);
+                var t = Z(this).constructor;
+                i = Reflect.construct(o, arguments, t);
             } else {
-                i = a.apply(this, arguments);
+                i = o.apply(this, arguments);
             }
-            return M(this, i);
+            return U(this, i);
         };
     }
-    function M(r, e) {
-        if (e && (R(e) === "object" || typeof e === "function")) {
+    function U(r, e) {
+        if (e && (W(e) === "object" || typeof e === "function")) {
             return e;
         }
-        return z(r);
+        return X(r);
     }
-    function z(r) {
+    function X(r) {
         if (r === void 0) {
             throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
         }
         return r;
     }
-    function F() {
+    function Y() {
         if (typeof Reflect === "undefined" || !Reflect.construct) return false;
         if (Reflect.construct.sham) return false;
         if (typeof Proxy === "function") return true;
@@ -415,26 +610,26 @@
             return false;
         }
     }
-    function G(r) {
-        G = Object.setPrototypeOf ? Object.getPrototypeOf : function r(e) {
+    function Z(r) {
+        Z = Object.setPrototypeOf ? Object.getPrototypeOf : function r(e) {
             return e.__proto__ || Object.getPrototypeOf(e);
         };
-        return G(r);
+        return Z(r);
     }
-    function J(r, e, o) {
+    function rr(r, e, a) {
         if (e in r) {
             Object.defineProperty(r, e, {
-                value: o,
+                value: a,
                 enumerable: true,
                 configurable: true,
                 writable: true
             });
         } else {
-            r[e] = o;
+            r[e] = a;
         }
         return r;
     }
-    var K = {
+    var er = {
         action: t().string,
         appearance: t().oneOf([ "default", "secondary", "primary", "destructive", "pill", "toggle", "flat" ]),
         append: t().bool,
@@ -449,7 +644,7 @@
         splunkTheme: t().object,
         to: t().string
     };
-    var Q = {
+    var ar = {
         appearance: "default",
         append: false,
         disabled: false,
@@ -459,8 +654,8 @@
         prepend: false,
         selected: false
     };
-    var U = function r(e, o) {
-        var a = {
+    var or = function r(e, a) {
+        var o = {
             default: "enterpriseDefault",
             destructive: "enterpriseError",
             primary: "enterprisePrimary",
@@ -478,28 +673,28 @@
             toggle: "prismaToggle",
             flat: "prismaFlat"
         };
-        if (o === "enterprise") {
-            return a[e];
+        if (a === "enterprise") {
+            return o[e];
         }
         return i[e];
     };
-    var X =  function(r) {
-        W(o, r);
-        var e = L(o);
-        function o() {
+    var ir =  function(r) {
+        J(a, r);
+        var e = Q(a);
+        function a() {
             var r;
-            N(this, o);
-            for (var a = arguments.length, i = new Array(a), t = 0; t < a; t++) {
+            z(this, a);
+            for (var o = arguments.length, i = new Array(o), t = 0; t < o; t++) {
                 i[t] = arguments[t];
             }
             r = e.call.apply(e, [ this ].concat(i));
-            J(z(r), "component", null);
-            J(z(r), "handleMount", (function(e) {
+            rr(X(r), "component", null);
+            rr(X(r), "handleMount", (function(e) {
                 r.component = e;
             }));
             return r;
         }
-        q(o, [ {
+        G(a, [ {
             key: "focus",
             /**
      * Places focus on the button.
@@ -511,35 +706,35 @@
         }, {
             key: "render",
             value: function r() {
-                var e = this.props, o = e.appearance, i = e.append, t = e.children, n = e.onClick, s = e.disabled, d = e.error, b = e.prepend, v = e.selected, u = e.splunkTheme, p = E(e, [ "appearance", "append", "children", "onClick", "disabled", "error", "prepend", "selected", "splunkTheme" ]);
-                var f = o;
+                var e = this.props, a = e.appearance, i = e.append, t = e.children, n = e.onClick, s = e.disabled, d = e.error, v = e.prepend, b = e.selected, u = e.splunkTheme, p = L(e, [ "appearance", "append", "children", "onClick", "disabled", "error", "prepend", "selected", "splunkTheme" ]);
+                var f = a;
                 if (u.isEnterprise) {
-                    f = d ? "destructive" : o;
+                    f = d ? "destructive" : a;
                 }
                 
-                return a().createElement(_, A({
+                return o().createElement(V, I({
                     "aria-disabled": s === "dimmed" || undefined,
                     "aria-invalid": d,
                     "data-test": "button-simple",
                     disabled: s === true,
                     ref: this.handleMount,
-                    $variant: U(f, u.family),
+                    $variant: or(f, u.family),
                     $append: i,
-                    $prepend: b,
-                    $selected: v,
+                    $prepend: v,
+                    $selected: b,
                     $error: d
                 }, p, {
                     onClick: n && !s ? n : undefined
-                }), t, v &&  a().createElement(c(), null, (0, l._)("Selected")));
+                }), t, b &&  o().createElement(c(), null, (0, l._)("Selected")));
             }
         } ]);
-        return o;
-    }(o.Component);
-    J(X, "defaultProps", Q);
-    J(X, "propTypes", K);
-    var Y = (0, n.withSplunkTheme)(X);
-    Y.propTypes = X.propTypes;
-    /* harmony default export */    const Z = Y;
+        return a;
+    }(a.Component);
+    rr(ir, "defaultProps", ar);
+    rr(ir, "propTypes", er);
+    var tr = (0, n.withSplunkTheme)(ir);
+    tr.propTypes = ir.propTypes;
+    /* harmony default export */    const lr = tr;
     // CONCATENATED MODULE: ./src/ButtonSimple/index.ts
     module.exports = e;
     /******/})();