@splunk/react-ui 4.40.0 → 4.42.0

package/Text.js

@@ -93,8 +93,8 @@
     const g = require("@splunk/react-icons/enterprise/Search");
     var x =  e.n(g);
     // CONCATENATED MODULE: external "@splunk/react-icons/Magnifier"
-    const w = require("@splunk/react-icons/Magnifier");
-    var C =  e.n(w);
+    const C = require("@splunk/react-icons/Magnifier");
+    var w =  e.n(C);
     // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
     const k = require("@splunk/react-ui/ScreenReaderContent");
     var S =  e.n(k);
@@ -215,8 +215,14 @@
     var Q = R().span.withConfig({
         displayName: "TextStyles__StyledInputWrapper",
         componentId: "eg7n6t-3"
-    })([ "", ";cursor:text;flex-grow:1;min-height:", ";position:relative;overflow:hidden;border:1px solid ", ";border-radius:", ";box-sizing:border-box;background-color:", ";box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);padding:", ";align-items:center;", " ", " ", " ", " ", " ", " ", "" ], O.mixins.reset("inline-flex"), O.variables.inputHeight, O.variables.interactiveColorBorder, O.variables.borderRadius, (0, 
+    })([ "", ";cursor:text;flex-grow:1;min-height:", ";position:relative;overflow:hidden;border:1px solid ", ";border-radius:", ";box-sizing:border-box;background-color:", ";box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);padding:", ";align-items:center;", " ", " ", " ", " ", " ", " ", "" ], O.mixins.reset("inline-flex"), O.variables.inputHeight, (0, 
     O.pick)({
+        prisma: O.variables.interactiveColorBorder,
+        enterprise: {
+            light: O.variables.interactiveColorBorder,
+            dark: O.variables.borderColorWeak
+        }
+    }), O.variables.borderRadius, (0, O.pick)({
         enterprise: {
             light: O.variables.white,
             dark: O.variables.gray22
@@ -236,7 +242,13 @@
         return !t && (0, M.css)([ "&:focus-within{box-shadow:", ";color:", ";}" ], O.variables.focusShadow, O.variables.contentColorActive);
     }), (function(e) {
         var t = e.$isDisabled, r = e.$isDimmed;
-        return t || r ? K : (0, M.css)([ "&:hover{border-color:", ";}" ], O.variables.interactiveColorBorderHover);
+        return t || r ? K : (0, M.css)([ "&:hover{border-color:", ";}" ], (0, O.pick)({
+            enterprise: {
+                light: O.variables.interactiveColorBorderHover,
+                dark: O.variables.borderColorWeak
+            },
+            prisma: O.variables.interactiveColorBorderHover
+        }));
     }), (function(e) {
         var t = e.$error;
         return t && (0, M.css)([ "&,&:hover{border-color:", ";}" ], O.variables.accentColorNegative);
@@ -528,14 +540,14 @@
             }
         }), Object.defineProperty(e, "prototype", {
             writable: !1
-        }), t && we(e, t);
+        }), t && Ce(e, t);
     }
-    function we(e, t) {
-        return we = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(e, t) {
+    function Ce(e, t) {
+        return Ce = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(e, t) {
             return e.__proto__ = t, e;
-        }, we(e, t);
+        }, Ce(e, t);
     }
-    function Ce(e) {
+    function we(e) {
         var t = Ae();
         return function() {
             var r, n = Ee(e);
@@ -659,7 +671,7 @@
     };
     /** Note: Text places role and aria props onto the input. All other props are placed on the wrapper. */    var Pe =  function(e) {
         xe(r, e);
-        var t = Ce(r);
+        var t = we(r);
         ge(r, null, [ {
             key: "validateRows",
             // @docs-props-type TextPropsBase
@@ -810,9 +822,9 @@
                         "aria-label": g
                     }));
                 }
-                var w = i.context;
-                var C = (e = w.labelAttrs) === null || e === void 0 ? void 0 : e.text;
-                var k = C ? (0, I._)("Clear ".concat(C, " text field")) : (0, I._)("Clear text field");
+                var C = i.context;
+                var w = (e = C.labelAttrs) === null || e === void 0 ? void 0 : e.text;
+                var k = w ? (0, I._)("Clear ".concat(w, " text field")) : (0, I._)("Clear text field");
                 var S = i.getDisplayValue();
                 if (m && r === "search") {
                     if (!S) {
@@ -890,7 +902,7 @@
                     return n().createElement(ne, p,  n().createElement(U, {
                         "data-test": "search-icon",
                         $disabled: !!o
-                    },  n().createElement(C(), {
+                    },  n().createElement(w(), {
                         height: c,
                         width: c
                     })));
@@ -961,14 +973,14 @@
         }, {
             key: "render",
             value: function e() {
-                var t = this.props, r = t.append, i = t.autoCapitalize, a = t.autoComplete, o = t.autoCorrect, l = t.autoFocus, s = t.children, p = t.className, u = t.classNamePrivate, f = t.disabled, v = t.describedBy, h = t.elementRef, b = t.error, y = t.inline, g = t.inputClassName, x = t.inputId, w = t.labelledBy, C = t.multiline, k = t.maxLength, A = t.name, O = t.passwordVisibilityToggle, I = t.placeholder, $ = t.prepend, j = t.required, P = t.spellCheck, _ = t.tabIndex, D = t.title, B = t.type, N = t.useSyntheticPlaceholder, q = fe(t, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "children", "className", "classNamePrivate", "disabled", "describedBy", "elementRef", "error", "inline", "inputClassName", "inputId", "labelledBy", "multiline", "maxLength", "name", "passwordVisibilityToggle", "placeholder", "prepend", "required", "spellCheck", "tabIndex", "title", "type", "useSyntheticPlaceholder" ]);
+                var t = this.props, r = t.append, i = t.autoCapitalize, a = t.autoComplete, o = t.autoCorrect, l = t.autoFocus, s = t.children, p = t.className, u = t.classNamePrivate, f = t.disabled, v = t.describedBy, h = t.elementRef, b = t.error, y = t.inline, g = t.inputClassName, x = t.inputId, C = t.labelledBy, w = t.multiline, k = t.maxLength, A = t.name, O = t.passwordVisibilityToggle, I = t.placeholder, $ = t.prepend, j = t.required, P = t.spellCheck, _ = t.tabIndex, D = t.title, B = t.type, N = t.useSyntheticPlaceholder, q = fe(t, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "children", "className", "classNamePrivate", "disabled", "describedBy", "elementRef", "error", "inline", "inputClassName", "inputId", "labelledBy", "multiline", "maxLength", "name", "passwordVisibilityToggle", "placeholder", "prepend", "required", "spellCheck", "tabIndex", "title", "type", "useSyntheticPlaceholder" ]);
                 var M = me(me({
                     role: "textbox"
                 }, m()(q, (function(e, t) {
                     return t === "role" || t.indexOf("aria-") === 0;
                 }))), {}, {
                     "aria-describedby": v,
-                    "aria-labelledby": w,
+                    "aria-labelledby": C,
                     "aria-invalid": b || undefined,
                     "aria-disabled": f === "dimmed"
                 });
@@ -1019,7 +1031,7 @@
                 var Y = this.renderEndAdornment();
                 var ee = !!U;
                 var ne = !!Y;
-                if (C) {
+                if (w) {
                     
                     return n().createElement(E(), this.props);
                 }

package/TextArea.js

@@ -61,7 +61,7 @@
         e.r(r);
     // EXPORTS
         e.d(r, {
-        default: () => /* reexport */ De
+        default: () => /* reexport */ qe
     });
     // CONCATENATED MODULE: external "react"
     const t = require("react");
@@ -85,8 +85,8 @@
     const v = require("lodash/omit");
     var h =  e.n(v);
     // CONCATENATED MODULE: external "lodash/pickBy"
-    const m = require("lodash/pickBy");
-    var b =  e.n(m);
+    const b = require("lodash/pickBy");
+    var m =  e.n(b);
     // CONCATENATED MODULE: external "lodash/throttle"
     const y = require("lodash/throttle");
     var g =  e.n(y);
@@ -115,9 +115,9 @@
     var $ =  e.n(M);
     // CONCATENATED MODULE: external "@splunk/react-ui/Button"
     const _ = require("@splunk/react-ui/Button");
-    var q =  e.n(_);
+    var W =  e.n(_);
     // CONCATENATED MODULE: ./src/TextArea/TextAreaStyles.ts
-    var D = T()(q()).withConfig({
+    var q = T()(W()).withConfig({
         displayName: "TextAreaStyles__StyledClearButton",
         componentId: "gfy8yp-0"
     })([ "display:none;visibility:hidden;border-radius:", ";cursor:pointer;font-size:0.83333em;flex-grow:0;", ";&:not([disabled]){color:", ";}" ], (0, 
@@ -137,7 +137,7 @@
         },
         prisma: k.variables.contentColorMuted
     }));
-    var N = T().span.withConfig({
+    var D = T().span.withConfig({
         displayName: "TextAreaStyles__StyledSearchIconWrapper",
         componentId: "gfy8yp-1"
     })([ "", ";color:", ";pointer-events:none;padding:", ";", "" ], k.mixins.reset("inline-block"), (0, 
@@ -157,14 +157,14 @@
             prisma: (0, P.css)([ "color:", ";" ], k.variables.contentColorDisabled)
         }));
     }));
-    var W = "230px";
+    var N = "230px";
     var B = T()($()).withConfig({
         displayName: "TextAreaStyles__StyledBox",
         componentId: "gfy8yp-2"
-    })([ "display:flex;justify-content:space-between;flex-grow:1;flex-shrink:1;position:relative;&[data-inline]{width:", ";flex-basis:", ";[data-inline] + &{margin-left:", ";}}&:focus-within:not([disabled]){", " ", "{visibility:visible;display:block;}}" ], W, W, k.variables.spacingSmall, (0, 
+    })([ "display:flex;justify-content:space-between;flex-grow:1;flex-shrink:1;position:relative;&[data-inline]{width:", ";flex-basis:", ";[data-inline] + &{margin-left:", ";}}&:focus-within:not([disabled]){", " ", "{visibility:visible;display:block;}}" ], N, N, k.variables.spacingSmall, (0, 
     k.pick)({
-        enterprise: (0, P.css)([ "", "{display:none;}" ], /* sc-sel */ N)
-    }), /* sc-sel */ D);
+        enterprise: (0, P.css)([ "", "{display:none;}" ], /* sc-sel */ D)
+    }), /* sc-sel */ q);
     var R = (0, k.pick)({
         prisma: "12px",
         enterprise: "10px"
@@ -179,8 +179,8 @@
     })([ "", " flex-grow:1;min-height:", ";position:relative;overflow:hidden;border:1px solid ", ";border-radius:", ";box-sizing:border-box;background-color:", ";box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);align-items:center;padding:0 ", " 0 ", ";", " ", " &:hover:not([disabled]){border-color:", ";}&:focus-within:not([disabled]){box-shadow:", ";color:", ";}", " ", " ", " ", "" ], k.mixins.reset("inline-flex"), k.variables.inputHeight, (0, 
     k.pick)({
         enterprise: {
-            light: k.variables.gray60,
-            dark: k.variables.gray20
+            light: k.variables.borderColorStrong,
+            dark: k.variables.borderColorWeak
         },
         prisma: k.variables.interactiveColorBorder
     }), k.variables.borderRadius, (0, k.pick)({
@@ -197,8 +197,8 @@
         return r && (0, P.css)([ "padding-left:0;" ]);
     }), (0, k.pick)({
         enterprise: {
-            light: k.variables.gray60,
-            dark: k.variables.gray20
+            light: k.variables.borderColorStrong,
+            dark: k.variables.borderColorWeak
         },
         prisma: k.variables.interactiveColorBorderHover
     }), k.variables.focusShadow, k.variables.contentColorActive, (function(e) {
@@ -352,7 +352,7 @@
             height: i
         });
         
-        return n().createElement(D, J({
+        return n().createElement(q, J({
             "data-test": "clear",
             icon: l,
             appearance: o,
@@ -530,7 +530,7 @@
     }
     function he(e, r) {
         if (null == e) return {};
-        var t, n, a = me(e, r);
+        var t, n, a = be(e, r);
         if (Object.getOwnPropertySymbols) {
             var o = Object.getOwnPropertySymbols(e);
             for (n = 0; n < o.length; n++) {
@@ -539,7 +539,7 @@
         }
         return a;
     }
-    function me(e, r) {
+    function be(e, r) {
         if (null == e) return {};
         var t = {};
         for (var n in e) {
@@ -550,7 +550,7 @@
         }
         return t;
     }
-    function be(e, r) {
+    function me(e, r) {
         if (!(e instanceof r)) throw new TypeError("Cannot call a class as a function");
     }
     function ye(e, r) {
@@ -715,7 +715,7 @@
         } ]);
         function t(e) {
             var a;
-            be(this, t);
+            me(this, t);
             a = r.call(this, e);
             Ie(Se(a), "controlledExternally", void 0);
             Ie(Se(a), "input", null);
@@ -849,7 +849,7 @@
                     return a.renderAdornment( n().createElement(n().Fragment, null,  n().createElement(Q, {
                         "aria-label": f,
                         onClick: a.handleClear
-                    }),  n().createElement(N, {
+                    }),  n().createElement(D, {
                         $disabled: i
                     },  n().createElement(te, null))), "end");
                 }
@@ -869,7 +869,7 @@
                     return a.renderAdornment(t, "start");
                 }
                 if (l && r === "search") {
-                    return a.renderAdornment( n().createElement(N, {
+                    return a.renderAdornment( n().createElement(D, {
                         $disabled: i
                     },  n().createElement(te, null)), "start");
                 }
@@ -936,23 +936,23 @@
         }, {
             key: "render",
             value: function e() {
-                var r = this.props, t = r.append, a = r.autoCapitalize, o = r.autoComplete, i = r.autoCorrect, l = r.autoFocus, s = r.children, c = r.className, d = r.classNamePrivate, u = r.disabled, v = r.describedBy, m = r.elementRef, y = r.error, g = r.inline, x = r.inputClassName, w = r.inputId, k = r.labelledBy, S = r.maxLength, O = r.name, I = r.placeholder, j = r.prepend, E = r.required, P = r.rowsMin, T = r.spellCheck, M = r.tabIndex, $ = r.title, _ = he(r, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "children", "className", "classNamePrivate", "disabled", "describedBy", "elementRef", "error", "inline", "inputClassName", "inputId", "labelledBy", "maxLength", "name", "placeholder", "prepend", "required", "rowsMin", "spellCheck", "tabIndex", "title" ]);
-                var q = ve(ve({}, b()(_, (function(e, r) {
+                var r = this.props, t = r.append, a = r.autoCapitalize, o = r.autoComplete, i = r.autoCorrect, l = r.autoFocus, s = r.children, c = r.className, d = r.classNamePrivate, u = r.disabled, v = r.describedBy, b = r.elementRef, y = r.error, g = r.inline, x = r.inputClassName, w = r.inputId, k = r.labelledBy, S = r.maxLength, O = r.name, I = r.placeholder, j = r.prepend, E = r.required, P = r.rowsMin, T = r.spellCheck, M = r.tabIndex, $ = r.title, _ = he(r, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "children", "className", "classNamePrivate", "disabled", "describedBy", "elementRef", "error", "inline", "inputClassName", "inputId", "labelledBy", "maxLength", "name", "placeholder", "prepend", "required", "rowsMin", "spellCheck", "tabIndex", "title" ]);
+                var W = ve(ve({}, m()(_, (function(e, r) {
                     return r === "role" || r.indexOf("aria-") === 0;
                 }))), {}, {
                     "aria-describedby": v,
                     "aria-labelledby": k,
                     "aria-invalid": y || undefined
                 });
-                var D = h()(_, [ "inputRef", "onBlur", "onChange", "onFocus", "onKeyDown", "onSelect", "onInputClick" ].concat(le(p()(q))));
-                var N = this.getDisplayValue();
-                var W = {
+                var q = h()(_, [ "inputRef", "onBlur", "onChange", "onFocus", "onKeyDown", "onSelect", "onInputClick" ].concat(le(p()(W))));
+                var D = this.getDisplayValue();
+                var N = {
                     className: (0, A.toClassName)(c, x),
                     $append: t || undefined,
                     $error: y,
                     $prepend: j || undefined
                 };
-                var R = ve(ve({}, q), {}, {
+                var R = ve(ve({}, W), {}, {
                     "data-test": "textbox",
                     autoCapitalize: a,
                     autoComplete: o,
@@ -977,7 +977,7 @@
                     },
                     tabIndex: M,
                     title: $,
-                    value: N,
+                    value: D,
                     $error: y
                 });
                 var z = this.renderStartAdornment();
@@ -989,15 +989,15 @@
                     tabIndex: -1,
                     className: (0, A.toClassName)(c, d),
                     "data-test": "text-area",
-                    "data-test-value": N,
-                    elementRef: m,
+                    "data-test-value": D,
+                    elementRef: b,
                     flex: true,
                     inline: g
-                }, D), z,  n().createElement(F, ie({
+                }, q), z,  n().createElement(F, ie({
                     $hasEndAdornment: G,
                     $hasStartAdornment: L,
                     disabled: u
-                }, W), L &&  n().createElement(U, {
+                }, N), L &&  n().createElement(U, {
                     $width: this.state.startAdornmentWidth
                 }),  n().createElement(V, {
                     "aria-hidden": "true",
@@ -1007,7 +1007,7 @@
                     tabIndex: -1,
                     rows: this.props.rowsMin,
                     ref: this.handleShadowMount,
-                    value: I && !N ? I : N
+                    value: I && !D ? I : D
                 }),  n().createElement(H, ie({
                     $rowsMin: P
                 }, R, {
@@ -1028,10 +1028,10 @@
     Ie($e, "componentType", "TextArea");
     Ie($e, "contextType", x.ControlGroupContext);
     var _e = (0, k.withSplunkTheme)($e);
-    var qe = _e;
-    qe.propTypes = $e.propTypes;
-    qe.componentType = $e.componentType;
-    /* harmony default export */    const De = qe;
+    var We = _e;
+    We.propTypes = $e.propTypes;
+    We.componentType = $e.componentType;
+    /* harmony default export */    const qe = We;
     // only for styled components using TextArea
         // CONCATENATED MODULE: ./src/TextArea/index.ts
     module.exports = r;