@splunk/react-ui 4.32.0 → 4.34.0

package/Table.js

@@ -211,9 +211,9 @@
     function U(e) {
         var t = Y();
         return function n() {
-            var r = Q(e), o;
+            var r = J(e), o;
             if (t) {
-                var i = Q(this).constructor;
+                var i = J(this).constructor;
                 o = Reflect.construct(r, arguments, i);
             } else {
                 o = r.apply(this, arguments);
@@ -244,13 +244,13 @@
             return false;
         }
     }
-    function Q(e) {
-        Q = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
+    function J(e) {
+        J = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
             return t.__proto__ || Object.getPrototypeOf(t);
         };
-        return Q(e);
+        return J(e);
     }
-    function J(e, t, n) {
+    function Q(e, t, n) {
         if (t in e) {
             Object.defineProperty(e, t, {
                 value: n,
@@ -447,20 +447,12 @@
         F(n, e);
         var t = U(n);
         function n() {
-            var e;
             W(this, n);
-            for (var r = arguments.length, o = new Array(r), i = 0; i < r; i++) {
-                o[i] = arguments[i];
-            }
-            e = t.call.apply(t, [ this ].concat(o));
-            J(X(e), "el", null);
-            J(X(e), "rect", void 0);
-            J(X(e), "rowHeight", void 0);
-            J(X(e), "rows", void 0);
-            return e;
+            return t.apply(this, arguments);
         }
         B(n, [ {
             key: "render",
+            // @docs-props-type BodyPropsBase
             value: function e() {
                 
                 return r().createElement(ue, this.props);
@@ -468,9 +460,9 @@
         } ]);
         return n;
     }(n.Component);
-    J(de, "splunkUiType", "Table.Body");
-    J(de, "propTypes", ce);
-    J(de, "defaultProps", se);
+    Q(de, "splunkUiType", "Table.Body");
+    Q(de, "propTypes", ce);
+    Q(de, "defaultProps", se);
     /* harmony default export */    const fe = de;
  // exporting the base component for testing purpose
         // CONCATENATED MODULE: ./src/Table/TableStyles.ts
@@ -501,7 +493,7 @@
         displayName: "TableStyles__StyledTableCaption",
         componentId: "sc-1cmfss7-5"
     })([ "padding:", ";font-size:", ";caption-side:", ";" ], (0, M.pick)({
-        enterprise: "".concat(M.variables.spacingQuarter, " 0"),
+        enterprise: "".concat(M.variables.spacingXSmall, " 0"),
         prisma: "5px 0"
     }), M.variables.fontSizeLarge, (function(e) {
         var t = e.side;
@@ -613,7 +605,13 @@
             prisma: (0, z.css)([ "color:", ";*:hover > &&{cursor:pointer;}" ], M.variables.contentColorDefault)
         },
         link: {
-            enterprise: (0, z.css)([ "color:", ";&:hover{cursor:pointer;color:{dark:variables.accentColorL20,light:variables.linkColor,};box-shadow:", ";}&:focus{color:{dark:variables.accentColorL20,light:variables.focusColor,};box-shadow:", ";}" ], M.variables.linkColor, M.variables.focusShadowInset, M.variables.focusShadowInset)
+            enterprise: (0, z.css)([ "color:", ";&:hover{cursor:pointer;", " box-shadow:", ";}&:focus{", " box-shadow:", ";}" ], M.variables.linkColor, (0, 
+            M.pick)({
+                dark: (0, z.css)([ "color:", ";" ], M.variables.accentColorL20)
+            }), M.variables.focusShadowInset, (0, M.pick)({
+                dark: (0, z.css)([ "color:", ";" ], M.variables.accentColorL20),
+                light: (0, z.css)([ "color:", ";" ], M.variables.focusColor)
+            }), M.variables.focusShadowInset)
         }
     }), (function(e) {
         var t = e.$clickable, n = e.$focusWithin;
@@ -878,10 +876,10 @@
     var Xe =  e.n(Ge);
     // CONCATENATED MODULE: external "lodash/isString"
     const Ye = require("lodash/isString");
-    var Qe =  e.n(Ye);
+    var Je =  e.n(Ye);
     // CONCATENATED MODULE: external "lodash/merge"
-    const Je = require("lodash/merge");
-    var Ze =  e.n(Je);
+    const Qe = require("lodash/merge");
+    var Ze =  e.n(Qe);
     // CONCATENATED MODULE: external "@splunk/react-icons/ArrowDown"
     const et = require("@splunk/react-icons/ArrowDown");
     var tt =  e.n(et);
@@ -1397,8 +1395,8 @@
         truncate: i().bool,
         width: i().oneOfType([ i().number, i().oneOf([ "auto" ]) ])
     };
-    var Qt = new Set([ "none", "asc", "desc" ]);
-    var Jt = Object.freeze({
+    var Jt = new Set([ "none", "asc", "desc" ]);
+    var Qt = Object.freeze({
         none: (0, D._)("Click to sort"),
         asc: (0, D._)("Press to sort descending"),
         desc: (0, D._)("Press to sort ascending")
@@ -1422,7 +1420,7 @@
         var H = (0, n.useState)(false), L = Wt(H, 2), N = L[0], $ = L[1];
         var W = (0, n.useState)(false), K = Wt(W, 2), B = K[0], F = K[1];
         var V = (0, n.useState)(0), U = Wt(V, 2), G = U[0], X = U[1];
-        var Y = (0, n.useState)(0), Q = Wt(Y, 2), J = Q[0], Z = Q[1];
+        var Y = (0, n.useState)(0), J = Wt(Y, 2), Q = J[0], Z = J[1];
         var ee = (0, n.useRef)(null);
  // Cleanup dragend, and unmount during drag
                 (0, n.useEffect)((function() {
@@ -1433,10 +1431,10 @@
         var te;
         var ne;
         var re;
-        if (C !== undefined && Qt.has(C)) {
+        if (C !== undefined && Jt.has(C)) {
             var oe = j ? Zt : en;
             ne = oe[C];
-            re = Jt[C];
+            re = Qt[C];
         }
         if (a === "auto") {
             var ie;
@@ -1505,7 +1503,7 @@
         };
         var ue = function e(n) {
             var r = G - n.clientX;
-            var a = Math.max(J - r, 16);
+            var a = Math.max(Q - r, 16);
             if (t !== undefined) {
                 b === null || b === void 0 ? void 0 : b(n, {
                     index: t,
@@ -1916,7 +1914,7 @@
                     ref: c,
                     "aria-sort": y && (this.sortDirAriaMapping[w] || "none"),
                     "data-test": "head-cell",
-                    "data-test-label": Qe()(a) ? a : undefined,
+                    "data-test-label": Je()(a) ? a : undefined,
                     "data-test-sort-dir": y && w,
                     id: S ? u : undefined,
                     onClick: y || j ? this.handleClick : undefined,
@@ -2059,7 +2057,7 @@
             title: o ? (0, D._)("Collapse row") : (0, D._)("Expand row")
         }, u);
     };
-    var Qn = H()(Yn).withConfig({
+    var Jn = H()(Yn).withConfig({
         displayName: "ExpansionRow__StyledExpansionRowIcon",
         componentId: "sc-1b6vao4-0"
     })([ "transition:transform ", ";", "" ], (0, M.pick)({
@@ -2068,8 +2066,8 @@
     }), (function(e) {
         return e.expanded && (0, z.css)([ "transform:rotate(90deg);" ]);
     }));
-    Qn.propTypes = Xn;
-    /* harmony default export */    const Jn = Qn;
+    Jn.propTypes = Xn;
+    /* harmony default export */    const Qn = Jn;
     // CONCATENATED MODULE: ./src/Table/RowDragCellStyles.ts
     var Zn = H().td.withConfig({
         displayName: "RowDragCellStyles__StyledCell",
@@ -2632,7 +2630,7 @@
                 L(e);
             }
         }
-        var Q = !w ? n.Children.toArray(c).map((function(e) {
+        var J = !w ? n.Children.toArray(c).map((function(e) {
             
             return (0, n.cloneElement)(e, {
                 disabled: d
@@ -2644,15 +2642,15 @@
                 disabled: d
             });
         }));
-        var J;
+        var Q;
         if (O) {
-            J = O;
-        } else if ((t = Q[S]) === null || t === void 0 ? void 0 : t.props.children) {
+            Q = O;
+        } else if ((t = J[S]) === null || t === void 0 ? void 0 : t.props.children) {
             var Z;
-            J = "".concat((Z = Q[S]) === null || Z === void 0 ? void 0 : Z.props.children);
+            Q = "".concat((Z = J[S]) === null || Z === void 0 ? void 0 : Z.props.children);
         } else {
             var ee;
-            J = "".concat((ee = Q[0]) === null || ee === void 0 ? void 0 : ee.props.children);
+            Q = "".concat((ee = J[0]) === null || ee === void 0 ? void 0 : ee.props.children);
             if (false) {}
         }
         var te = (0, T.sprintf)((0, D._)("%(selected)s"), {
@@ -2682,7 +2680,7 @@
             style: W
         }), f && b != null &&  r().createElement(ar, Nr({
             "aria-label": (0, T.sprintf)((0, D._)("Reorder %(rowLabelValue)s"), {
-                rowLabelValue: J
+                rowLabelValue: Q
             }),
             setActivatorNodeRef: $,
             listeners: z
@@ -2697,7 +2695,7 @@
             "data-test": "toggle"
         },  r().createElement(kr, {
             "aria-label": (0, T.sprintf)((0, D._)("%(rowLabelValue)s %(selectedString)s"), {
-                rowLabelValue: J,
+                rowLabelValue: Q,
                 selectedString: te
             }),
             disabled: d,
@@ -2714,12 +2712,12 @@
             onClick: U,
             rowSpan: re,
             variant: "expand"
-        },  r().createElement(Jn, {
+        },  r().createElement(Qn, {
             expanded: h
         })), v && !y &&  r().createElement(dr, {
             variant: "expand",
             "data-movable-column": oe
-        }), Q, o && !i && !a &&  r().createElement(Fe, {
+        }), J, o && !i && !a &&  r().createElement(Fe, {
             align: "right",
             appearance: d ? "data" : "rowLink",
             "data-test": "row-actions",
@@ -2777,7 +2775,7 @@
         enterprise: "32px",
         prisma: "40px"
     }));
-    var Qr = H()(In).withConfig({
+    var Jr = H()(In).withConfig({
         displayName: "HeadStyles__StyledDragRow",
         componentId: "iap21t-3"
     })([ "width:", ";" ], (0, M.pick)({
@@ -2785,18 +2783,18 @@
         prisma: "40px"
     }));
     // CONCATENATED MODULE: ./src/Table/Head.tsx
-    function Jr(e) {
+    function Qr(e) {
         "@babel/helpers - typeof";
         if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-            Jr = function e(t) {
+            Qr = function e(t) {
                 return typeof t;
             };
         } else {
-            Jr = function e(t) {
+            Qr = function e(t) {
                 return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
             };
         }
-        return Jr(e);
+        return Qr(e);
     }
     function Zr() {
         Zr = Object.assign || function(e) {
@@ -2865,7 +2863,7 @@
         };
     }
     function ao(e, t) {
-        if (t && (Jr(t) === "object" || typeof t === "function")) {
+        if (t && (Qr(t) === "object" || typeof t === "function")) {
             return t;
         }
         return lo(e);
@@ -3220,7 +3218,7 @@
                 return r().createElement(Gr, Zr({
                     ref: this.handleMount,
                     "data-test": I
-                }, g()(this.props, Xe()(o.propTypes))),  r().createElement(Ur, null, s &&  r().createElement(Qr, {
+                }, g()(this.props, Xe()(o.propTypes))),  r().createElement(Ur, null, s &&  r().createElement(Jr, {
                     key: "drag_rows_head_cell",
                     "data-test": "drag-rows-head-cell",
                     align: "center",
@@ -3755,12 +3753,12 @@
     /* harmony default export */    const Go = Uo;
     // CONCATENATED MODULE: ./src/Table/KeyboardSensor.ts
     function Xo(e, t) {
-        return Jo(e) || Qo(e, t) || ti(e, t) || Yo();
+        return Qo(e) || Jo(e, t) || ti(e, t) || Yo();
     }
     function Yo() {
         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 Qo(e, t) {
+    function Jo(e, t) {
         if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(e))) return;
         var n = [];
         var r = true;
@@ -3783,7 +3781,7 @@
         }
         return n;
     }
-    function Jo(e) {
+    function Qo(e) {
         if (Array.isArray(e)) return e;
     }
     function Zo(e) {
@@ -4567,12 +4565,12 @@
         }
         return Yi(e);
     }
-    function Qi(e, t) {
+    function Ji(e, t) {
         if (!(e instanceof t)) {
             throw new TypeError("Cannot call a class as a function");
         }
     }
-    function Ji(e, t) {
+    function Qi(e, t) {
         for (var n = 0; n < t.length; n++) {
             var r = t[n];
             r.enumerable = r.enumerable || false;
@@ -4582,8 +4580,8 @@
         }
     }
     function Zi(e, t, n) {
-        if (t) Ji(e.prototype, t);
-        if (n) Ji(e, n);
+        if (t) Qi(e.prototype, t);
+        if (n) Qi(e, n);
         return e;
     }
     function ea(e, t) {
@@ -4874,7 +4872,7 @@
         var H = (0, n.useState)([]), M = pa(H, 2), L = M[0], N = M[1];
         var $ = (0, n.useState)(), W = pa($, 2), K = W[0], B = W[1];
         var F = (0, n.useState)(), V = pa(F, 2), U = V[0], G = V[1];
-        var X = (0, n.useState)(), Y = pa(X, 2), Q = Y[0], J = Y[1];
+        var X = (0, n.useState)(), Y = pa(X, 2), J = Y[0], Q = Y[1];
         var Z = (0, n.useState)(), ee = pa(Z, 2), te = ee[0], ne = ee[1];
  // states are used with dragging effect
                 var re = (0, n.useState)(), oe = pa(re, 2), ie = oe[0], ae = oe[1];
@@ -4912,7 +4910,7 @@
             ne(t === null || t === void 0 ? void 0 : t.clientWidth);
             G(r === null || r === void 0 ? void 0 : r.clientWidth);
             N(o);
-            J(l);
+            Q(l);
         }), [ c, p ]);
         (0, n.useEffect)((function() {
             var e = we.current;
@@ -5118,7 +5116,7 @@
             }, i);
             return l;
         };
-        var Qe = function e(r) {
+        var Je = function e(r) {
             var o = (t === null || t === void 0 ? void 0 : t.filter(n.isValidElement)) || [];
             n.Children.toArray(r === null || r === void 0 ? void 0 : r.props.children).filter(n.isValidElement).forEach((function(e, t) {
                 var r;
@@ -5139,7 +5137,7 @@
                 stripeRows: q
             }, Ie);
         };
-        var Je = function e() {
+        var Qe = function e() {
             var t = Re.current;
             var n = zt();
             if (!Sa(p) || !Oe.current || !we.current || !t) {
@@ -5158,12 +5156,12 @@
             return r.bottom > t.innerHeight && r.top < t.innerHeight;
         };
         var et = function e(t, o) {
-            if (Je()) {
+            if (Qe()) {
                 // FIXME: handle inline
                 // Save the current head focus state so that it can be applied to the docked version
                 // after the `HeadTable` mounts.
                 xe.current = Ea(we.current);
-                if (L === undefined || U === undefined || Q === undefined || te === undefined) {
+                if (L === undefined || U === undefined || J === undefined || te === undefined) {
                     return false;
                 }
                 var i =  (0, n.cloneElement)(t, {
@@ -5176,7 +5174,7 @@
                     cellWidths: L,
                     horizontalOffset: K,
                     tableWidth: U,
-                    top: Q,
+                    top: J,
                     width: te,
                     tableStyle: A,
                     isFixedColumn: o,
@@ -5249,7 +5247,7 @@
                     }));
                 }
             } else if (t === "Table.Body") {
-                ot = Qe(e);
+                ot = Je(e);
             } else if (t === "Table.Caption") {
                 // the html spec mandates that a caption must be the first table child.
                 // catch the caption here so that it can be placed first later. note: a
@@ -5357,7 +5355,7 @@
         ea(n, e);
         var t = na(n);
         function n() {
-            Qi(this, n);
+            Ji(this, n);
             return t.apply(this, arguments);
         }
         Zi(n, [ {

package/Text.js

@@ -290,11 +290,7 @@
     var G = N()(V()).withConfig({
         displayName: "TextStyles__StyledBox",
         componentId: "eg7n6t-2"
-    })([ "display:flex;justify-content:space-between;flex-grow:1;flex-shrink:1;position:relative;&[data-inline]{width:230px;flex-basis:230px;[data-inline] + &{margin-left:", ";}}&:focus-within:not([disabled]){", "{", "}", "{visibility:visible;display:block;}}", "" ], (0, 
-    A.pick)({
-        enterprise: A.variables.spacingHalf,
-        prisma: A.variables.spacingSmall
-    }), 
+    })([ "display:flex;justify-content:space-between;flex-grow:1;flex-shrink:1;position:relative;&[data-inline]{width:230px;flex-basis:230px;[data-inline] + &{margin-left:", ";}}&:focus-within:not([disabled]){", "{", "}", "{visibility:visible;display:block;}}", "" ], A.variables.spacingSmall, 
     /* sc-sel */
     K, (0, A.pick)({
         enterprise: (0, D.css)([ "display:none;" ])
@@ -317,8 +313,8 @@
         },
         prisma: A.variables.transparent
     }), (0, A.pick)({
-        enterprise: "0px 10px",
-        prisma: "0px 12px"
+        enterprise: "0 10px",
+        prisma: "0 12px"
     }), (function(e) {
         var t = e.$hasEndAdornment;
         return t && (0, D.css)([ "padding-right:0;" ]);
@@ -355,7 +351,7 @@
             compact: "20px"
         }
     }), (0, A.pick)({
-        enterprise: A.variables.spacingHalf,
+        enterprise: A.variables.spacingSmall,
         prisma: "14px"
     }), A.variables.contentColorMuted, (function(e) {
         var t = e.$error;
@@ -906,7 +902,7 @@
                     var h = i.state.hideVisibility ?  n().createElement(B, null) :  n().createElement($, null);
                     
                     return n().createElement(re, m,  n().createElement(Q, {
-                        appearance: p ? "secondary" : "pill",
+                        appearance: "subtle",
                         "data-test": "password-toggle",
                         inline: false,
                         onClick: i.handleVisibilityToggle,
@@ -917,9 +913,9 @@
                 var b = i.context;
                 var C = (e = b.labelAttrs) === null || e === void 0 ? void 0 : e.text;
                 var x = C ? (0, T._)("Clear ".concat(C, " text field")) : (0, T._)("Clear text field");
-                var k = i.getDisplayValue();
-                if (!p && r === "search") {
-                    if (!k) {
+                var w = i.getDisplayValue();
+                if (u && r === "search") {
+                    if (!w) {
                         
                         return n().createElement(re, m,  n().createElement(K, {
                             $disabled: l,
@@ -933,40 +929,36 @@
                     }
                     
                     return n().createElement(re, m, !l &&  n().createElement(H, {
-                        appearance: p ? "secondary" : "pill",
+                        appearance: "subtle",
                         "data-test": "clear",
                         inline: false,
-                        icon: u ?  n().createElement(y(), {
+                        "aria-label": x,
+                        icon:  n().createElement(y(), {
                             size: 1,
-                            screenReaderText: x
-                        }) :  n().createElement(v(), {
-                            "aria-label": x
+                            screenReaderText: null
                         }),
                         onClick: i.handleClear
                     }),  n().createElement(K, {
                         "data-test": "search-icon",
                         $disabled: l
-                    }, u ?  n().createElement(g(), {
+                    },  n().createElement(g(), {
                         screenReaderText: null,
                         hideDefaultTooltip: true,
                         size: "16px",
                         inline: false
-                    }) :  n().createElement(w(), {
-                        width: f,
-                        height: f
                     })));
                 }
-                if (!!k && (p && r === "search" || s)) {
+                if (!!w && (p && r === "search" || s)) {
                     
                     return n().createElement(re, m, !l &&  n().createElement(H, {
                         "data-test": "clear",
-                        appearance: p ? "secondary" : "pill",
+                        appearance: "subtle",
+                        "aria-label": x,
                         onClick: i.handleClear,
                         icon: u ?  n().createElement(y(), {
                             inline: false,
-                            screenReaderText: x
+                            screenReaderText: null
                         }) :  n().createElement(v(), {
-                            "aria-label": x,
                             height: f,
                             inline: false,
                             width: f
@@ -996,7 +988,6 @@
                         "data-test": "search-icon",
                         $disabled: o
                     },  n().createElement(w(), {
-                        "aria-label": "Search",
                         height: c,
                         width: c
                     })));
@@ -1118,8 +1109,10 @@
                                 var H = _ === "password" || A ? undefined : q;
  // Firefox hack (SUI-2716). Remove when fixed: https://bugzilla.mozilla.org/show_bug.cgi?id=1427173
                                 var K = _ === "time";
-                var Q = !!this.renderEndAdornment();
-                var Y = !!this.renderStartAdornment();
+                var Q = this.renderStartAdornment();
+                var Y = this.renderEndAdornment();
+                var re = !!Q;
+                var ne = !!Y;
                 if (w) {
                     
                     return n().createElement(E(), this.props);
@@ -1134,11 +1127,11 @@
                     elementRef: v,
                     flex: true,
                     inline: y
-                }, N), this.renderStartAdornment(),  n().createElement(U, ae({
-                    $hasEndAdornment: Q,
-                    $hasStartAdornment: Y,
+                }, N), Q,  n().createElement(U, ae({
+                    $hasEndAdornment: ne,
+                    $hasStartAdornment: re,
                     disabled: m
-                }, V), Y &&  n().createElement(ee, {
+                }, V), re &&  n().createElement(ee, {
                     $width: this.state.startAdornmentWidth
                 }), m ?  n().createElement(J, ae({
                     className: (0, O.toClassName)(p, u),
@@ -1152,15 +1145,15 @@
                     onClick: this.handleInputClick
                 })), F &&  n().createElement(L(), null, T), F &&  n().createElement(X, {
                     $endAdornmentWidth: this.state.endAdornmentWidth,
-                    $hasBothAdornment: Y && Q,
-                    $hasEndAdornment: Q,
-                    $hasStartAdornment: Y,
+                    $hasBothAdornment: re && ne,
+                    $hasEndAdornment: ne,
+                    $hasStartAdornment: re,
                     $startAdornmentWidth: this.state.startAdornmentWidth,
                     "aria-hidden": true,
                     "data-role": "placeholder"
-                }, T), s, Q &&  n().createElement(te, {
+                }, T), s, ne &&  n().createElement(te, {
                     $width: this.state.endAdornmentWidth
-                })), this.renderEndAdornment());
+                })), Y);
             }
         } ]);
         return r;