@splunk/react-ui 4.33.0 → 4.34.0

package/MessageBar.js

@@ -70,21 +70,21 @@
     const s = require("prop-types");
     var n =  e.n(s);
     // CONCATENATED MODULE: external "@splunk/react-icons/Cross"
-    const t = require("@splunk/react-icons/Cross");
-    var o =  e.n(t);
+    const o = require("@splunk/react-icons/Cross");
+    var t =  e.n(o);
     // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/Close"
     const c = require("@splunk/react-icons/enterprise/Close");
     var l =  e.n(c);
     // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
     const p = require("@splunk/react-ui/ScreenReaderContent");
-    var u =  e.n(p);
+    var d =  e.n(p);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const d = require("@splunk/themes");
+    const u = require("@splunk/themes");
     // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
     const v = require("@splunk/ui-utils/i18n");
     // CONCATENATED MODULE: external "styled-components"
-    const g = require("styled-components");
-    var b =  e.n(g);
+    const b = require("styled-components");
+    var g =  e.n(b);
     // CONCATENATED MODULE: external "@splunk/react-icons/CheckCircle"
     const h = require("@splunk/react-icons/CheckCircle");
     var y =  e.n(h);
@@ -92,8 +92,8 @@
     const m = require("@splunk/react-icons/ExclamationCircle");
     var f =  e.n(m);
     // CONCATENATED MODULE: external "@splunk/react-icons/InformationCircle"
-    const k = require("@splunk/react-icons/InformationCircle");
-    var x =  e.n(k);
+    const x = require("@splunk/react-icons/InformationCircle");
+    var k =  e.n(x);
     // CONCATENATED MODULE: external "@splunk/react-icons/ExclamationTriangle"
     const C = require("@splunk/react-icons/ExclamationTriangle");
     var w =  e.n(C);
@@ -116,152 +116,152 @@
     const N = require("@splunk/react-ui/Clickable");
     var R =  e.n(N);
     // CONCATENATED MODULE: ./src/MessageBar/MessageBarStyles.ts
-    var T = b().div.withConfig({
+    var T = g().div.withConfig({
         displayName: "MessageBarStyles__MessageBarContent",
         componentId: "sc-1uyhzza-0"
-    })([ "", ";color:inherit;padding:0 8px;text-align:center;margin-right:auto;& a{display:inline-block;color:inherit;text-decoration:underline;text-underline-position:under;padding:0 3px 2px 3px;&:not([disabled]):focus{border-radius:", ";outline:0;box-shadow:", ";}}" ], d.mixins.reset("inline"), d.variables.borderRadius, (0, 
-    d.pick)({
+    })([ "", ";color:inherit;padding:0 8px;text-align:center;margin-right:auto;& a{display:inline-block;color:inherit;text-decoration:underline;text-underline-position:under;padding:0 3px 2px 3px;&:not([disabled]):focus{border-radius:", ";outline:0;", ";}}" ], u.mixins.reset("inline"), u.variables.borderRadius, (0, 
+    u.pick)({
         enterprise: {
-            dark: (0, g.css)([ "0 0 0 2px ", "" ], d.variables.gray80),
-            light: (0, g.css)([ "0 0 0 2px ", "" ], d.variables.gray25)
+            dark: (0, b.css)([ "box-shadow:0 0 0 2px ", ";" ], u.variables.gray80),
+            light: (0, b.css)([ "box-shadow:0 0 0 2px ", ";" ], u.variables.gray25)
         },
         prisma: {
-            light: (0, d.pickVariant)("$type", {
-                info: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.black),
-                warning: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.black),
-                error: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.white),
-                success: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.white)
+            light: (0, u.pickVariant)("$type", {
+                info: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.black),
+                warning: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.black),
+                error: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.white),
+                success: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.white)
             }),
-            dark: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.black)
+            dark: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.black)
         }
     }));
-    var W = b()(R()).withConfig({
+    var W = g()(R()).withConfig({
         displayName: "MessageBarStyles__MessageBarCloseWrapper",
         componentId: "sc-1uyhzza-1"
-    })([ "", ";border:1px solid transparent;border-radius:", ";color:inherit;cursor:pointer;padding:", ";", " &:hover,&:focus{background:", ";border:", ";color:", ";}&:active{", ";}", "" ], d.mixins.reset("flex"), d.variables.borderRadius, (0, 
-    d.pick)({
-        enterprise: d.variables.spacingXSmall,
+    })([ "", ";border:1px solid transparent;border-radius:", ";color:inherit;cursor:pointer;padding:", ";", " &:hover,&:focus{background:", ";border:1px solid;border-color:", ";color:", ";}&:active{", ";}", "" ], u.mixins.reset("flex"), u.variables.borderRadius, (0, 
+    u.pick)({
+        enterprise: u.variables.spacingXSmall,
         prisma: "3px"
-    }), (0, d.pick)({
-        enterprise: (0, g.css)([ "margin-top:1px;" ])
-    }), (0, d.pick)({
-        prisma: d.variables.interactiveColorOverlayHover,
+    }), (0, u.pick)({
+        enterprise: (0, b.css)([ "margin-top:1px;" ])
+    }), (0, u.pick)({
+        prisma: u.variables.interactiveColorOverlayHover,
         enterprise: {
-            dark: d.variables.gray30,
-            light: d.variables.gray92
+            dark: u.variables.gray30,
+            light: u.variables.gray92
         }
-    }), (0, d.pick)({
-        prisma: (0, g.css)([ "1px solid inherit" ]),
-        enterprise: (0, g.css)([ "1px solid ", "" ], d.variables.gray80)
-    }), (0, d.pick)({
+    }), (0, u.pick)({
+        prisma: "inherit",
+        enterprise: u.variables.gray80
+    }), (0, u.pick)({
         enterprise: {
-            dark: d.variables.gray96,
-            light: d.variables.linkColor
+            dark: u.variables.gray96,
+            light: u.variables.linkColor
         }
-    }), (0, d.pick)({
-        prisma: (0, g.css)([ "background:", ";" ], d.variables.interactiveColorOverlayActive),
-        enterprise: (0, g.css)([ "box-shadow:", ";" ], d.variables.focusShadow)
-    }), (0, d.pick)({
-        prisma: (0, g.css)([ "&:focus{border-radius:", ";box-shadow:", ";}" ], d.variables.borderRadius, (0, 
-        d.pick)({
-            light: (0, d.pickVariant)("$type", {
-                info: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.black),
-                warning: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.black),
-                error: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.white),
-                success: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.white)
+    }), (0, u.pick)({
+        prisma: (0, b.css)([ "background:", ";" ], u.variables.interactiveColorOverlayActive),
+        enterprise: (0, b.css)([ "box-shadow:", ";" ], u.variables.focusShadow)
+    }), (0, u.pick)({
+        prisma: (0, b.css)([ "&:focus{border-radius:", ";", ";}" ], u.variables.borderRadius, (0, 
+        u.pick)({
+            light: (0, u.pickVariant)("$type", {
+                info: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.black),
+                warning: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.black),
+                error: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.white),
+                success: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.white)
             }),
-            dark: (0, g.css)([ "0 0 0 3px ", "" ], d.variables.black)
+            dark: (0, b.css)([ "box-shadow:0 0 0 3px ", ";" ], u.variables.black)
         }))
     }));
-    var $ = (0, g.css)([ "margin-left:auto;" ]);
-    var P = b()(y()).withConfig({
+    var $ = (0, b.css)([ "margin-left:auto;" ]);
+    var P = g()(y()).withConfig({
         displayName: "MessageBarStyles__StyledCheckCircleIcon",
         componentId: "sc-1uyhzza-2"
     })([ "", "" ], $);
-    var A = b()(f()).withConfig({
+    var A = g()(f()).withConfig({
         displayName: "MessageBarStyles__StyledExclamationCircleIcon",
         componentId: "sc-1uyhzza-3"
     })([ "", "" ], $);
-    var L = b()(x()).withConfig({
+    var L = g()(k()).withConfig({
         displayName: "MessageBarStyles__StyledInformationCircleIcon",
         componentId: "sc-1uyhzza-4"
     })([ "", "" ], $);
-    var V = b()(w()).withConfig({
+    var V = g()(w()).withConfig({
         displayName: "MessageBarStyles__StyledExclamationTriangleIcon",
         componentId: "sc-1uyhzza-5"
     })([ "", "" ], $);
-    var D = b()(_()).withConfig({
+    var D = g()(_()).withConfig({
         displayName: "MessageBarStyles__StyledEnterpriseErrorIcon",
         componentId: "sc-1uyhzza-6"
-    })([ "", " color:", ";" ], $, d.variables.errorColor);
-    var H = b()(z()).withConfig({
+    })([ "", " color:", ";" ], $, u.variables.errorColor);
+    var H = g()(z()).withConfig({
         displayName: "MessageBarStyles__StyledEnterpriseInfoCircleIcon",
         componentId: "sc-1uyhzza-7"
-    })([ "", " color:", ";" ], $, d.variables.infoColor);
-    var X = b()(O()).withConfig({
+    })([ "", " color:", ";" ], $, u.variables.infoColor);
+    var X = g()(O()).withConfig({
         displayName: "MessageBarStyles__StyledEnterpriseSuccessIcon",
         componentId: "sc-1uyhzza-8"
-    })([ "", " color:", ";" ], $, d.variables.successColor);
-    var F = b()(B()).withConfig({
+    })([ "", " color:", ";" ], $, u.variables.successColor);
+    var F = g()(B()).withConfig({
         displayName: "MessageBarStyles__StyledEnterpriseWarningIcon",
         componentId: "sc-1uyhzza-9"
-    })([ "", " color:", ";" ], $, d.variables.warningColor);
-    var G = b()(j()).withConfig({
+    })([ "", " color:", ";" ], $, u.variables.warningColor);
+    var G = g()(j()).withConfig({
         displayName: "MessageBarStyles__MessageBarWrapper",
         componentId: "sc-1uyhzza-10"
-    })([ "", ";display:flex;align-items:center;justify-content:center;min-height:40px;margin-bottom:", ";", ";word-wrap:break-word;color:", ";", ";" ], d.mixins.reset("block"), d.variables.spacingSmall, (function(e) {
+    })([ "", ";display:flex;align-items:center;justify-content:center;min-height:40px;margin-bottom:", ";", ";word-wrap:break-word;color:", ";", ";" ], u.mixins.reset("block"), u.variables.spacingSmall, (function(e) {
         var r = e.$hasCloseButton;
-        return r ? (0, g.css)([ "", "" ], (0, d.pick)({
-            prisma: (0, g.css)([ "padding:0 8px 0 32px;" ]),
-            enterprise: (0, g.css)([ "padding:0 8px 0 38px;" ])
-        })) : (0, g.css)([ "", "" ], (0, d.pick)({
-            prisma: (0, g.css)([ "padding:0 33px 0 32px;" ]),
-            enterprise: (0, g.css)([ "padding:0 26px 0 32px;" ])
+        return r ? (0, b.css)([ "", "" ], (0, u.pick)({
+            prisma: (0, b.css)([ "padding:0 8px 0 32px;" ]),
+            enterprise: (0, b.css)([ "padding:0 8px 0 38px;" ])
+        })) : (0, b.css)([ "", "" ], (0, u.pick)({
+            prisma: (0, b.css)([ "padding:0 33px 0 32px;" ]),
+            enterprise: (0, b.css)([ "padding:0 26px 0 32px;" ])
         }));
-    }), (0, d.pick)({
-        prisma: (0, d.pickVariant)("$type", {
+    }), (0, u.pick)({
+        prisma: (0, u.pickVariant)("$type", {
             info: {
-                light: d.variables.contentColorActive,
-                dark: d.variables.contentColorInverted
+                light: u.variables.contentColorActive,
+                dark: u.variables.contentColorInverted
             },
-            success: d.variables.contentColorInverted,
-            warning: d.variables.black,
-            error: d.variables.contentColorInverted
+            success: u.variables.contentColorInverted,
+            warning: u.variables.black,
+            error: u.variables.contentColorInverted
         }),
         enterprise: {
-            dark: d.variables.gray96,
-            light: d.variables.gray25
+            dark: u.variables.gray96,
+            light: u.variables.gray25
         }
-    }), (0, d.pickVariant)("$type", {
-        info: (0, g.css)([ "background-color:", ";" ], (0, d.pick)({
+    }), (0, u.pickVariant)("$type", {
+        info: (0, b.css)([ "background-color:", ";" ], (0, u.pick)({
             prisma: {
-                dark: d.variables.white,
-                light: d.variables.neutral200
+                dark: u.variables.white,
+                light: u.variables.neutral200
             },
             enterprise: {
-                dark: d.mixins.colorWithAlpha(d.variables.infoColor, .5),
-                light: d.variables.infoColorL50
+                dark: u.mixins.colorWithAlpha(u.variables.infoColor, .5),
+                light: u.variables.infoColorL50
             }
         })),
-        success: (0, g.css)([ "background-color:", ";" ], (0, d.pick)({
-            prisma: d.variables.accentColorPositive,
+        success: (0, b.css)([ "background-color:", ";" ], (0, u.pick)({
+            prisma: u.variables.accentColorPositive,
             enterprise: {
-                dark: d.mixins.colorWithAlpha(d.variables.successColor, .5),
-                light: d.variables.successColorL50
+                dark: u.mixins.colorWithAlpha(u.variables.successColor, .5),
+                light: u.variables.successColorL50
             }
         })),
-        warning: (0, g.css)([ "background-color:", ";" ], (0, d.pick)({
-            prisma: d.variables.accentColorWarning,
+        warning: (0, b.css)([ "background-color:", ";" ], (0, u.pick)({
+            prisma: u.variables.accentColorWarning,
             enterprise: {
-                dark: d.mixins.colorWithAlpha(d.variables.warningColor, .5),
-                light: d.variables.warningColorL50
+                dark: u.mixins.colorWithAlpha(u.variables.warningColor, .5),
+                light: u.variables.warningColorL50
             }
         })),
-        error: (0, g.css)([ "background-color:", ";" ], (0, d.pick)({
-            prisma: d.variables.accentColorNegative,
+        error: (0, b.css)([ "background-color:", ";" ], (0, u.pick)({
+            prisma: u.variables.accentColorNegative,
             enterprise: {
-                dark: d.mixins.colorWithAlpha(d.variables.errorColor, .5),
-                light: d.variables.errorColorL50
+                dark: u.mixins.colorWithAlpha(u.variables.errorColor, .5),
+                light: u.variables.errorColorL50
             }
         }))
     }));
@@ -334,14 +334,14 @@
     function ae(e) {
         var r = e.children, a = e.type, s = e.onRequestClose, n = K(e, [ "children", "type", "onRequestClose" ]);
         // @docs-props-type MessageBarPropsBase
-                var t = (0, d.useSplunkTheme)(), c = t.isEnterprise;
+                var o = (0, u.useSplunkTheme)(), c = o.isEnterprise;
         var p = c && a === "error" ? "22px" : re;
-        var g = c && a === "warning" ? "21px" : re;
-        var b;
+        var b = c && a === "warning" ? "21px" : re;
+        var g;
         if (c) {
             var h = Z[a];
-            b =  i().createElement(h, {
-                height: g,
+            g =  i().createElement(h, {
+                height: b,
                 width: p,
                 hideDefaultTooltip: true,
                 screenReaderText: null,
@@ -350,7 +350,7 @@
             });
         } else {
             var y = ee[a];
-            b =  i().createElement(y, {
+            g =  i().createElement(y, {
                 height: re,
                 width: re,
                 variant: "filled",
@@ -366,7 +366,7 @@
         }, n, {
             role: "region",
             $hasCloseButton: Boolean(s)
-        }), b,  i().createElement(u(), null, Y[a]),  i().createElement(T, {
+        }), g,  i().createElement(d(), null, Y[a]),  i().createElement(T, {
             $type: a,
             "data-test": "content"
         }, r), s &&  i().createElement(W, {
@@ -377,13 +377,13 @@
             hideDefaultTooltip: true,
             screenReaderText: null,
             width: "12px"
-        }) :  i().createElement(o(), {
+        }) :  i().createElement(t(), {
             height: "19px",
             style: {
                 margin: -.5
             },
             width: "19px"
-        }),  i().createElement(u(), null, (0, v._)("Close"))));
+        }),  i().createElement(d(), null, (0, v._)("Close"))));
     }
     ae.propTypes = U;
     /* harmony default export */    const ie = ae;

package/Modal.js

@@ -239,7 +239,7 @@
         componentId: "yszcmv-0"
     })([ "flex:0 0 auto;text-align:right;padding:", ";background-color:", ";& > button{min-width:80px;}" ], (0, 
     w.pick)({
-        enterprise: w.variables.spacing,
+        enterprise: w.variables.spacingLarge,
         prisma: {
             comfortable: "24px",
             compact: "18px 24px"
@@ -516,7 +516,7 @@
         componentId: "sc-5fn8ds-0"
     })([ "", ";flex-direction:column;position:fixed;left:50%;transform:translateX(-50%);z-index:", ";", "" ], w.mixins.reset("flex"), w.variables.zindexModal, (0, 
     w.pick)({
-        enterprise: (0, g.css)([ "box-shadow:0 1px 5px ", ";max-height:calc(100vh - ", " * 4);max-width:calc(100vw - ", " * 4);" ], w.variables.black, w.variables.spacing, w.variables.spacing),
+        enterprise: (0, g.css)([ "box-shadow:0 1px 5px ", ";max-height:calc(100vh - ", " * 4);max-width:calc(100vw - ", " * 4);" ], w.variables.black, w.variables.spacingLarge, w.variables.spacingLarge),
         prisma: (0, g.css)([ "box-shadow:", ";max-height:calc(100vh - ", " * 4);max-width:calc(100vw - ", " * 4);border-radius:", ";overflow:hidden;" ], w.variables.modalShadow, w.variables.spacingXLarge, w.variables.spacingXLarge, w.variables.borderRadius)
     }));
     // CONCATENATED MODULE: ./src/utils/updateReactRef.ts

package/Multiselect.js

@@ -565,11 +565,11 @@
     z(G, "defaultProps", U);
     /* harmony default export */    const J = G;
     // CONCATENATED MODULE: external "lodash/castArray"
-    const Q = require("lodash/castArray");
-    var X =  e.n(Q);
+    const X = require("lodash/castArray");
+    var Y =  e.n(X);
     // CONCATENATED MODULE: external "lodash/find"
-    const Y = require("lodash/find");
-    var Z =  e.n(Y);
+    const Q = require("lodash/find");
+    var Z =  e.n(Q);
     // CONCATENATED MODULE: external "lodash/forEachRight"
     const ee = require("lodash/forEachRight");
     var te =  e.n(ee);
@@ -680,7 +680,10 @@
     var Ge = Fe().span.withConfig({
         displayName: "ItemStyles__StyledItemDescriptionRight",
         componentId: "sc-4kc053-1"
-    })([ "", ";float:right;padding-left:", ";max-width:50%;text-align:right;box-sizing:border-box;" ], We, Ae.variables.spacing);
+    })([ "", ";float:right;", " max-width:50%;text-align:right;box-sizing:border-box;" ], We, (0, 
+    Ae.pick)({
+        enterprise: (0, Le.css)([ "padding-left:", ";" ], Ae.variables.spacingLarge)
+    }));
     var Je = Fe().div.withConfig({
         displayName: "ItemStyles__StyledItemSelectedIcon",
         componentId: "sc-4kc053-2"
@@ -691,7 +694,7 @@
         prisma: Ae.variables.contentColorActive,
         enterprise: Ae.variables.accentColorL10
     }));
-    var Qe = Fe().span.withConfig({
+    var Xe = Fe().span.withConfig({
         displayName: "ItemStyles__StyledItemIcon",
         componentId: "sc-4kc053-3"
     })([ "flex:0 0 auto;padding-right:", ";min-width:10px;display:inline-block;text-align:center;vertical-align:", ";", "" ], (0, 
@@ -705,7 +708,7 @@
         prisma: (0, Le.css)([ "color:", ";display:inline-flex;align-items:center;min-width:20px;min-height:20px;& > svg{width:20px;height:20px;}" ], Ae.variables.contentColorMuted),
         enterprise: (0, Le.css)([ "transform:translateY(-1px);" ])
     }));
-    var Xe = Fe()($e()).withConfig({
+    var Ye = Fe()($e()).withConfig({
         displayName: "ItemStyles__StyledClickable",
         componentId: "sc-4kc053-4"
     })([ "display:block;position:relative;cursor:pointer;color:", ";word-wrap:break-word;max-width:100%;width:100%;padding:", ";", " ", " ", " &:not([disabled]){&:hover{background:", ";", "}&:focus{outline:0;box-shadow:", ";", "}", " ", "}&[disabled]{color:", ";cursor:not-allowed;", ",", "{color:inherit;}", "{cursor:not-allowed;color:", ";}", "}", "" ], (0, 
@@ -778,16 +781,16 @@
     }), (0, Ae.pick)({
         prisma: (0, Le.css)([ "& > * > ", "{color:", ";}" ], 
         /* sc-sel */
-        Qe, Ae.variables.contentColorDisabled)
+        Xe, Ae.variables.contentColorDisabled)
     }), (function(e) {
         var t = e.$selected;
         return t && (0, Ae.pick)({
             prisma: (0, Le.css)([ "", "{color:", ";}" ], 
             /* sc-sel */
-            Qe, Ae.variables.contentColorActive)
+            Xe, Ae.variables.contentColorActive)
         });
     }));
-    var Ye = Fe()(ze()).withConfig({
+    var Qe = Fe()(ze()).withConfig({
         displayName: "ItemStyles__StyledSwitch",
         componentId: "sc-4kc053-5"
     })([ "position:absolute;left:", ";top:", ";" ], (0, Ae.pick)({
@@ -877,7 +880,7 @@
             active: n,
             ref: t,
             tabIndex: -1
-        },  r().createElement(Ye, {
+        },  r().createElement(Qe, {
             interactive: false,
             selected: c === "some" && "some" || c,
             key: "main-checkbox",
@@ -944,10 +947,7 @@
     var bt = Fe().span.withConfig({
         displayName: "SelectBaseStyles__StyledCount",
         componentId: "sc-16cj7sk-5"
-    })([ "padding-right:", ";" ], (0, Ae.pick)({
-        enterprise: Ae.variables.spacingQuarter,
-        prisma: Ae.variables.spacingXSmall
-    }));
+    })([ "padding-right:", ";" ], Ae.variables.spacingXSmall);
     var yt = Fe()(Se()).withConfig({
         displayName: "SelectBaseStyles__StyledControlsLink",
         componentId: "sc-16cj7sk-6"
@@ -1338,11 +1338,11 @@
         }
         return e;
     }
-    var Qt = {
+    var Xt = {
         allowKeyMatching: a().bool,
         allowNewValues: a().bool,
         animateLoading: a().bool,
-        appearance: a().oneOf([ "default", "link", "primary", "pill", "toggle", "flat" ]),
+        appearance: a().oneOf([ "default", "link", "primary", "pill", "toggle", "flat", "subtle" ]),
         append: a().bool,
         children: a().node,
         defaultPlacement: a().oneOf([ "above", "below", "vertical" ]),
@@ -1385,7 +1385,7 @@
         /** @private. */
         virtualization: a().number
     };
-    var Xt = {
+    var Yt = {
         allowKeyMatching: true,
         allowNewValues: false,
         animateLoading: false,
@@ -1406,7 +1406,7 @@
         tabConfirmsNewValue: false,
         toggleContent: "optionChildren"
     };
-    var Yt = ce()((function(e) {
+    var Qt = ce()((function(e) {
         return [ e ];
     }));
  // preserve separate widths for single vs. multi mode
@@ -1755,9 +1755,9 @@
                                 if (k.length === 0 || !m && k.every((function(e) {
                     return e === "";
                 }))) {
-                    k = Yt(g);
+                    k = Qt(g);
  // placeholder has a default value so will not be undefined
-                                        I = Yt(g);
+                                        I = Qt(g);
                 }
  // If there's more than one item selected, read out the selected total
                 // rather than reading out each selected item
@@ -2037,7 +2037,7 @@
                     o = [ "".concat(t, ": ") ].concat(o);
                 }
                 if (r) {
-                    o = X()(o).concat(" ".concat(r));
+                    o = Y()(o).concat(" ".concat(r));
                 }
                 return o;
             }));
@@ -2276,8 +2276,8 @@
         } ]);
         return o;
     }(n.Component);
-    Jt(rn, "propTypes", Qt);
-    Jt(rn, "defaultProps", Xt);
+    Jt(rn, "propTypes", Xt);
+    Jt(rn, "defaultProps", Yt);
     Jt(rn, "Option", M);
     Jt(rn, "Divider", p.Divider);
     Jt(rn, "Heading", p.Heading);
@@ -2612,10 +2612,7 @@
     }), (function(e) {
         var t = e.$popoverOpen;
         return t && (0, Le.css)([ "position:relative;z-index:calc(", " - 2);" ], Ae.variables.zindexFixedNavbar);
-    }), (0, Ae.pick)({
-        enterprise: Ae.variables.spacingHalf,
-        prisma: Ae.variables.spacingSmall
-    }));
+    }), Ae.variables.spacingSmall);
     var Un = Fe().span.withConfig({
         displayName: "NormalStyles__StyledButtonsWrapper",
         componentId: "sc-1uwwpco-1"
@@ -2626,7 +2623,7 @@
     })([ "", ";flex:1 0 auto;max-width:100%;line-height:12px;", "" ], Ae.mixins.reset("block"), (0, 
     Ae.pick)({
         enterprise: {
-            comfortable: (0, Le.css)([ "padding:", ";" ], Ae.variables.spacingQuarter),
+            comfortable: (0, Le.css)([ "padding:", ";" ], Ae.variables.spacingXSmall),
             compact: (0, Le.css)([ "padding:3px;" ])
         },
         prisma: {
@@ -2648,7 +2645,7 @@
  * @param ref - The React callback or object ref. Can be `null` or `undefined`.
  * @param current - The new value of the ref.
  */
-    function Qn(e, t) {
+    function Xn(e, t) {
         if (e) {
             if (typeof e === "function") {
                 e(t);
@@ -2661,20 +2658,20 @@
         }
     }
     // CONCATENATED MODULE: ./src/Multiselect/Normal.tsx
-    function Xn(e) {
+    function Yn(e) {
         "@babel/helpers - typeof";
         if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-            Xn = function e(t) {
+            Yn = function e(t) {
                 return typeof t;
             };
         } else {
-            Xn = function e(t) {
+            Yn = function e(t) {
                 return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
             };
         }
-        return Xn(e);
+        return Yn(e);
     }
-    function Yn(e) {
+    function Qn(e) {
         return nr(e) || tr(e) || er(e) || Zn();
     }
     function Zn() {
@@ -2823,7 +2820,7 @@
         };
     }
     function hr(e, t) {
-        if (t && (Xn(t) === "object" || typeof t === "function")) {
+        if (t && (Yn(t) === "object" || typeof t === "function")) {
             return t;
         }
         return br(e);
@@ -3111,11 +3108,11 @@
                 a.setState({
                     el: e
                 });
-                Qn(a.props.elementRef, e);
+                Xn(a.props.elementRef, e);
             }));
             gr(br(a), "handleInputMount", (function(e) {
                 a.input = e;
-                Qn(a.props.inputRef, e);
+                Xn(a.props.inputRef, e);
             }));
             gr(br(a), "handleActiveOptionMount", (function(e) {
                 if (a.previousActiveIndex !== a.state.activeIndex) {
@@ -3398,7 +3395,7 @@
                     "data-test-values": JSON.stringify(I),
                     inline: b,
                     $hasfocus: this.state.hasFocus
-                }, c().apply(void 0, [ C, "animateLoading", "controlledFilter", "defaultValues", "footerMessage", "inputRef", "isLoadingOptions", "labelledBy", "menuStyle", "noOptionsMessage", "onChange", "onFilterChange", "onScroll", "onScrollBottom", "onClose", "onOpen", "values", "useClickawayOverlay" ].concat(Yn(le()(x)))), {
+                }, c().apply(void 0, [ C, "animateLoading", "controlledFilter", "defaultValues", "footerMessage", "inputRef", "isLoadingOptions", "labelledBy", "menuStyle", "noOptionsMessage", "onChange", "onFilterChange", "onScroll", "onScrollBottom", "onClose", "onOpen", "values", "useClickawayOverlay" ].concat(Qn(le()(x)))), {
                     onClick: v ? undefined : this.handleClick,
                     $disabled: v,
                     $error: h,

package/Paginator.js

@@ -155,7 +155,7 @@
         }));
     }), (0, v.pick)({
         enterprise: {
-            comfortable: (0, x.css)([ "padding:", ";" ], v.variables.spacingQuarter),
+            comfortable: (0, x.css)([ "padding:", ";" ], v.variables.spacingXSmall),
             compact: (0, x.css)([ "padding:3px;" ])
         },
         prisma: (0, x.css)([ "padding:", ";& + &{margin-left:8px;}" ], (0, v.pick)({
@@ -360,8 +360,8 @@
     const $ = require("@splunk/react-ui/Select");
     var A =  e.n($);
     // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
-    const Q = require("@splunk/react-ui/ScreenReaderContent");
-    var V =  e.n(Q);
+    const V = require("@splunk/react-ui/ScreenReaderContent");
+    var X =  e.n(V);
     // CONCATENATED MODULE: external "@splunk/ui-utils/id"
     const F = require("@splunk/ui-utils/id");
     // CONCATENATED MODULE: ./src/Paginator/PageSelectStyles.ts
@@ -373,12 +373,12 @@
         displayName: "PageSelectStyles__StyledCount",
         componentId: "haycz4-1"
     })([ "align-items:center;display:flex;flex-wrap:wrap;margin:0 ", ";" ], v.variables.spacingSmall);
-    var U = P()(A()).withConfig({
+    var Q = P()(A()).withConfig({
         displayName: "PageSelectStyles__StyledSelect",
         componentId: "haycz4-2"
     })([ "flex:0 0 auto;" ]);
     // CONCATENATED MODULE: ./src/Paginator/PageSelect.tsx
-    function X(e, t) {
+    function U(e, t) {
         if (e == null) return {};
         var r = Y(e, t);
         var n, a;
@@ -411,7 +411,7 @@
         totalPages: l().number
     };
     function ee(e) {
-        var t = e.onChange, a = e.current, l = a === void 0 ? 1 : a, i = e.totalPages, o = X(e, [ "onChange", "current", "totalPages" ]);
+        var t = e.onChange, a = e.current, l = a === void 0 ? 1 : a, i = e.totalPages, o = U(e, [ "onChange", "current", "totalPages" ]);
         // @docs-props-type PaginatorPageSelectPropsBase
                 var u = (0, r.useRef)((0, F.createDOMID)("pages"));
         var p = (0, r.useRef)((0, F.createDOMID)("totalPages"));
@@ -431,11 +431,11 @@
         }
         var g = (0, c.sprintf)((0, s._)("of %d pages"), i);
         
-        return n().createElement(J, o,  n().createElement(U, {
+        return n().createElement(J, o,  n().createElement(Q, {
             value: l,
             onChange: f,
             "aria-labelledby": "".concat(u.current, " ").concat(p.current)
-        }, d),  n().createElement(V(), {
+        }, d),  n().createElement(X(), {
             id: u.current,
             "aria-hidden": true
         }, l),  n().createElement(K, {