@splunk/react-ui 4.25.0 → 4.26.0

package/TextArea.js

@@ -61,7 +61,7 @@
         e.r(t);
     // EXPORTS
         e.d(t, {
-        default: () => /* reexport */ je
+        default: () => /* reexport */ $e
     });
     // CONCATENATED MODULE: external "react"
     const r = require("react");
@@ -106,206 +106,222 @@
     var E =  e.n(I);
     // CONCATENATED MODULE: external "@splunk/react-icons/Magnifier"
     const j = require("@splunk/react-icons/Magnifier");
-    var P =  e.n(j);
+    var T =  e.n(j);
     // CONCATENATED MODULE: external "@splunk/ui-utils/style"
-    const T = require("@splunk/ui-utils/style");
+    const M = require("@splunk/ui-utils/style");
     // CONCATENATED MODULE: external "@splunk/themes"
-    const _ = require("@splunk/themes");
+    const P = require("@splunk/themes");
     // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
-    const M = require("@splunk/ui-utils/i18n");
+    const $ = require("@splunk/ui-utils/i18n");
     // CONCATENATED MODULE: external "styled-components"
-    const $ = require("styled-components");
-    var D =  e.n($);
+    const _ = require("styled-components");
+    var D =  e.n(_);
     // CONCATENATED MODULE: external "@splunk/react-ui/Box"
     const N = require("@splunk/react-ui/Box");
     var R =  e.n(N);
     // CONCATENATED MODULE: external "@splunk/react-ui/Button"
     const q = require("@splunk/react-ui/Button");
-    var B =  e.n(q);
+    var W =  e.n(q);
     // CONCATENATED MODULE: ./src/TextArea/TextAreaStyles.ts
-    var W = (0, $.css)([ "cursor:not-allowed;color:", ";&::placeholder{color:", ";}" ], (0, 
-    _.pick)({
-        enterprise: _.variables.textDisabledColor,
-        prisma: _.variables.contentColorDisabled
-    }), (0, _.pick)({
-        enterprise: _.variables.textDisabledColor,
-        prisma: _.variables.contentColorDisabled
+    var B = (0, _.css)([ "cursor:not-allowed;color:", ";&::placeholder{color:", ";}" ], (0, 
+    P.pick)({
+        enterprise: P.variables.textDisabledColor,
+        prisma: P.variables.contentColorDisabled
+    }), (0, P.pick)({
+        enterprise: P.variables.textDisabledColor,
+        prisma: P.variables.contentColorDisabled
     }));
-    var z = (0, $.css)([ "border-radius:", ";cursor:pointer;font-size:0.83333em;flex-grow:0;", ";&:not([disabled]){color:", ";}" ], (0, 
-    _.pick)({
-        enterprise: _.variables.borderRadius,
+    var z = (0, _.css)([ "border-radius:", ";cursor:pointer;font-size:0.83333em;flex-grow:0;", ";&:not([disabled]){color:", ";}" ], (0, 
+    P.pick)({
+        enterprise: P.variables.borderRadius,
         prisma: "50%"
-    }), (0, _.pick)({
-        enterprise: (0, $.css)([ "width:", ";height:", ";" ], _.variables.inputHeight, _.variables.inputHeight),
+    }), (0, P.pick)({
+        enterprise: (0, _.css)([ "width:", ";height:", ";" ], P.variables.inputHeight, P.variables.inputHeight),
         prisma: {
-            comfortable: (0, $.css)([ "width:26px;min-width:26px;min-height:26px;margin:8px;padding:0;" ]),
-            compact: (0, $.css)([ "width:22px;min-width:22px;min-height:22px;margin:8px;padding:0;" ])
+            comfortable: (0, _.css)([ "width:26px;min-width:26px;min-height:26px;margin:8px;padding:0;" ]),
+            compact: (0, _.css)([ "width:22px;min-width:22px;min-height:22px;margin:8px;padding:0;" ])
         }
-    }), (0, _.pick)({
+    }), (0, P.pick)({
         enterprise: {
-            light: _.variables.gray60,
-            dark: _.variables.white
+            light: P.variables.gray60,
+            dark: P.variables.white
         },
-        prisma: _.variables.contentColorMuted
+        prisma: P.variables.contentColorMuted
     }));
-    var F = D()(B()).withConfig({
+    var H = D()(W()).withConfig({
         displayName: "TextAreaStyles__StyledClearButton",
         componentId: "gfy8yp-0"
     })([ "display:none;visibility:hidden;", "" ], z);
-    var H = D().span.withConfig({
+    var F = D().span.withConfig({
         displayName: "TextAreaStyles__StyledSearchIconWrapper",
         componentId: "gfy8yp-1"
-    })([ "", ";color:", ";pointer-events:none;padding:", ";", "" ], _.mixins.reset("inline-block"), (0, 
-    _.pick)({
+    })([ "", ";color:", ";pointer-events:none;padding:", ";", "" ], P.mixins.reset("inline-block"), (0, 
+    P.pick)({
         enterprise: {
-            light: _.variables.gray60,
-            dark: _.variables.white
+            light: P.variables.gray60,
+            dark: P.variables.white
         },
-        prisma: _.variables.contentColorMuted
-    }), (0, _.pick)({
+        prisma: P.variables.contentColorMuted
+    }), (0, P.pick)({
         comfortable: "0 8px",
         compact: "0 6px"
     }), (function(e) {
         var t = e.$disabled;
-        return t && (0, $.css)([ "", "" ], (0, _.pick)({
-            enterprise: (0, $.css)([ "color:", ";" ], _.variables.textDisabledColor),
-            prisma: (0, $.css)([ "color:", ";" ], _.variables.contentColorDisabled)
+        return t && (0, _.css)([ "", "" ], (0, P.pick)({
+            enterprise: (0, _.css)([ "color:", ";" ], P.variables.textDisabledColor),
+            prisma: (0, _.css)([ "color:", ";" ], P.variables.contentColorDisabled)
         }));
     }));
     var V = D()(R()).withConfig({
         displayName: "TextAreaStyles__StyledBox",
         componentId: "gfy8yp-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, 
-    _.pick)({
-        enterprise: _.variables.spacingHalf,
-        prisma: _.variables.spacingSmall
+    P.pick)({
+        enterprise: P.variables.spacingHalf,
+        prisma: P.variables.spacingSmall
     }), 
     /* sc-sel */
-    H, (0, _.pick)({
-        enterprise: (0, $.css)([ "display:none;" ])
+    F, (0, P.pick)({
+        enterprise: (0, _.css)([ "display:none;" ])
     }), 
     /* sc-sel */
-    F);
-    var K = D().span.withConfig({
+    H);
+    var K = 12;
+    var L = 10;
+    var G = 0;
+    var Q = D().span.withConfig({
         displayName: "TextAreaStyles__StyledTextAreaWrapper",
         componentId: "gfy8yp-3"
-    })([ "", " 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:", ";", " ", " &:hover:not([disabled]){border-color:", ";}&:focus-within:not([disabled]){", "}", " ", " ", " ", "" ], _.mixins.reset("inline-flex"), _.variables.inputHeight, (0, 
-    _.pick)({
+    })([ "", " 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:", ";", " ", " &:hover:not([disabled]){border-color:", ";}&:focus-within:not([disabled]){", "}", " ", " ", " ", "" ], P.mixins.reset("inline-flex"), P.variables.inputHeight, (0, 
+    P.pick)({
         enterprise: {
-            light: _.variables.gray60,
-            dark: _.variables.gray20
+            light: P.variables.gray60,
+            dark: P.variables.gray20
         },
-        prisma: _.variables.interactiveColorBorder
-    }), _.variables.borderRadius, (0, _.pick)({
+        prisma: P.variables.interactiveColorBorder
+    }), P.variables.borderRadius, (0, P.pick)({
         enterprise: {
-            light: _.variables.white,
-            dark: _.variables.gray22
+            light: P.variables.white,
+            dark: P.variables.gray22
         },
-        prisma: _.variables.transparent
-    }), (0, _.pick)({
-        enterprise: "0px 0px 0px 10px",
-        prisma: "0px 12px"
+        prisma: P.variables.transparent
+    }), (0, P.pick)({
+        enterprise: "0px ".concat(G, "px 0px ").concat(L, "px"),
+        prisma: "0px ".concat(K, "px")
     }), (function(e) {
         var t = e.$hasEndAdornment;
-        return t && (0, $.css)([ "padding-right:0;" ]);
+        return t && (0, _.css)([ "padding-right:0;" ]);
     }), (function(e) {
         var t = e.$hasStartAdornment;
-        return t && (0, $.css)([ "padding-left:0;" ]);
-    }), (0, _.pick)({
+        return t && (0, _.css)([ "padding-left:0;" ]);
+    }), (0, P.pick)({
         enterprise: {
-            light: _.variables.gray60,
-            dark: _.variables.gray20
+            light: P.variables.gray60,
+            dark: P.variables.gray20
         },
-        prisma: _.variables.interactiveColorBorderHover
-    }), (0, _.pick)({
-        enterprise: (0, $.css)([ "box-shadow:", ";color:", ";" ], _.variables.focusShadow, _.variables.textColor),
-        prisma: (0, $.css)([ "border-color:", ";color:", ";" ], _.variables.interactiveColorPrimary, _.variables.contentColorActive)
+        prisma: P.variables.interactiveColorBorderHover
+    }), (0, P.pick)({
+        enterprise: (0, _.css)([ "box-shadow:", ";color:", ";" ], P.variables.focusShadow, P.variables.textColor),
+        prisma: (0, _.css)([ "border-color:", ";color:", ";" ], P.variables.interactiveColorPrimary, P.variables.contentColorActive)
     }), (function(e) {
         var t = e.$error;
-        return t && (0, $.css)([ "&,&:hover:not([disabled]){border-color:", ";}&:focus-within:not([disabled]){", "}" ], (0, 
-        _.pick)({
-            enterprise: _.variables.errorColor,
-            prisma: _.variables.accentColorNegative
-        }), (0, _.pick)({
-            enterprise: (0, $.css)([ "box-shadow:", ";color:", ";" ], _.variables.focusShadow, _.variables.textColor),
-            prisma: (0, $.css)([ "border-color:", ";color:", ";" ], _.variables.interactiveColorPrimary, _.variables.contentColorActive)
+        return t && (0, _.css)([ "&,&:hover:not([disabled]){border-color:", ";}&:focus-within:not([disabled]){", "}" ], (0, 
+        P.pick)({
+            enterprise: P.variables.errorColor,
+            prisma: P.variables.accentColorNegative
+        }), (0, P.pick)({
+            enterprise: (0, _.css)([ "box-shadow:", ";color:", ";" ], P.variables.focusShadow, P.variables.textColor),
+            prisma: (0, _.css)([ "border-color:", ";color:", ";" ], P.variables.interactiveColorPrimary, P.variables.contentColorActive)
         }));
     }), (function(e) {
         var t = e.$append;
-        return t && (0, $.css)([ "margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0;border-right:none;" ]);
+        return t && (0, _.css)([ "margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0;border-right:none;" ]);
     }), (function(e) {
         var t = e.$prepend;
-        return t && (0, $.css)([ "border-top-left-radius:0;border-bottom-left-radius:0;" ]);
+        return t && (0, _.css)([ "border-top-left-radius:0;border-bottom-left-radius:0;" ]);
     }), (function(e) {
         var t = e.disabled;
-        return t && (0, $.css)([ "", " box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);" ], (0, 
-        _.pick)({
+        return t && (0, _.css)([ "", " box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);" ], (0, 
+        P.pick)({
             enterprise: {
-                light: (0, $.css)([ "background-color:", ";border-color:", ";" ], _.variables.gray96, _.variables.gray92),
-                dark: (0, $.css)([ "background-color:", ";border-color:", ";" ], _.variables.gray22, _.variables.gray30)
+                light: (0, _.css)([ "background-color:", ";border-color:", ";" ], P.variables.gray96, P.variables.gray92),
+                dark: (0, _.css)([ "background-color:", ";border-color:", ";" ], P.variables.gray22, P.variables.gray30)
             },
-            prisma: (0, $.css)([ "border-color:", ";" ], _.variables.interactiveColorBorderDisabled)
+            prisma: (0, _.css)([ "border-color:", ";" ], P.variables.interactiveColorBorderDisabled)
         }));
     }));
-    var L = D().textarea.withConfig({
+    var U = D().textarea.withConfig({
         displayName: "TextAreaStyles__StyledTextArea",
         componentId: "gfy8yp-4"
-    })([ "", ";outline-style:none;border:0;background:transparent;color:", ";flex-grow:1;font-family:", ";font-size:inherit;line-height:inherit;padding-top:", ";padding-bottom:", ";padding-right:", ";position:relative;resize:none;overflow:auto;white-space:pre-wrap;&::placeholder{color:", ";opacity:1;}", " ", "" ], _.mixins.reset("inline-flex"), (0, 
-    _.pick)({
-        enterprise: _.variables.textColor,
-        prisma: _.variables.contentColorActive
-    }), _.variables.sansFontFamily, (0, _.pick)({
+    })([ "", ";outline-style:none;border:0;background:transparent;color:", ";flex-grow:1;font-family:", ";font-size:inherit;line-height:inherit;padding-top:", ";padding-bottom:", ";padding-right:", ";position:relative;resize:none;overflow:auto;white-space:pre-wrap;", " &::placeholder{color:", ";opacity:1;}", " ", "" ], P.mixins.reset("inline-flex"), (0, 
+    P.pick)({
+        enterprise: P.variables.textColor,
+        prisma: P.variables.contentColorActive
+    }), P.variables.sansFontFamily, (0, P.pick)({
         enterprise: {
-            comfortable: _.variables.spacingQuarter,
+            comfortable: P.variables.spacingQuarter,
             compact: "3px"
         },
         prisma: {
-            comfortable: _.variables.spacingSmall,
+            comfortable: P.variables.spacingSmall,
             compact: "5px"
         }
-    }), (0, _.pick)({
+    }), (0, P.pick)({
         enterprise: {
-            comfortable: _.variables.spacingQuarter,
+            comfortable: P.variables.spacingQuarter,
             compact: "3px"
         },
         prisma: {
-            comfortable: _.variables.spacingSmall,
+            comfortable: P.variables.spacingSmall,
             compact: "5px"
         }
-    }), (0, _.pick)({
+    }), (0, P.pick)({
         enterprise: "10px",
         prisma: "14px"
-    }), _.variables.contentColorMuted, (function(e) {
+    }), (function(e) {
+        var t = e.$rowsMin;
+        return t && (0, _.css)([ "height:calc( ", " + (", " * ", ") + ", " );" ], P.variables.inputHeight, t - 1, P.variables.lineHeight, t > 1 ? "-3px" : "-2px");
+    }), P.variables.contentColorMuted, (function(e) {
         var t = e.$error;
-        return t && (0, $.css)([ "&,&:hover{color:", ";}" ], (0, _.pick)({
+        return t && (0, _.css)([ "&,&:hover{color:", ";}" ], (0, P.pick)({
             enterprise: {
-                light: _.variables.errorColorD10,
-                dark: _.variables.errorColorL20
+                light: P.variables.errorColorD10,
+                dark: P.variables.errorColorL20
             },
-            prisma: _.variables.contentColorActive
+            prisma: P.variables.contentColorActive
         }));
     }), (function(e) {
         var t = e.disabled;
-        return t && W;
+        return t && B;
     }));
-    var G = D()(B()).withConfig({
-        displayName: "TextAreaStyles__StyledVisibilityToggle",
+    var J = D()(U).withConfig({
+        displayName: "TextAreaStyles__StyledTextAreaShadow",
         componentId: "gfy8yp-5"
+    })([ "position:absolute;overflow:hidden;left:-10000px;top:-10000px;visibility:hidden;pointer-events:none;width:", ";" ], (function(e) {
+        var t = e.$startAdornmentWidth, r = e.$endAdornmentWidth;
+        return (0, _.css)([ "calc(100% - (", "));" ], (0, P.pick)({
+            prisma: (0, _.css)([ "", "px + ", "px" ], t || K, r || K),
+            enterprise: (0, _.css)([ "", "px + ", "px" ], t || L, r || G)
+        }));
+    }));
+    var X = D()(W()).withConfig({
+        displayName: "TextAreaStyles__StyledVisibilityToggle",
+        componentId: "gfy8yp-6"
     })([ "", "" ], z);
-    var Q = D().span.withConfig({
+    var Y = D().span.withConfig({
         displayName: "TextAreaStyles__StyledPlaceholder",
-        componentId: "gfy8yp-6"
+        componentId: "gfy8yp-7"
     })([ "pointer-events:none;color:", ";position:absolute;overflow:hidden;font-size:inherit;line-height:inherit;height:", ";margin-right:", ";", ";", ";", "" ], (0, 
-    _.pick)({
-        enterprise: _.variables.textGray,
-        prisma: _.variables.contentColorMuted
-    }), _.variables.lineHeight, (0, _.pick)({
+    P.pick)({
+        enterprise: P.variables.textGray,
+        prisma: P.variables.contentColorMuted
+    }), P.variables.lineHeight, (0, P.pick)({
         enterprise: "10px",
         prisma: "14px"
     }), (function(e) {
         var t = e.$hasStartAdornment, r = e.$startAdornmentWidth;
-        return t && (r ? (0, $.css)([ "margin-left:", "px;" ], r) : (0, $.css)([ "margin-left:", ";" ], (0, 
-        _.pick)({
+        return t && (r ? (0, _.css)([ "margin-left:", "px;" ], r) : (0, _.css)([ "margin-left:", ";" ], (0, 
+        P.pick)({
             enterprise: {
                 comfortable: "30px",
                 compact: "26px"
@@ -317,13 +333,13 @@
         })));
     }), (function(e) {
         var t = e.$hasEndAdornment, r = e.$endAdornmentWidth;
-        return t && (r ? (0, $.css)([ "max-width:calc( 100% - ", " - ", "px );" ], (0, _.pick)({
+        return t && (r ? (0, _.css)([ "max-width:calc( 100% - ", " - ", "px );" ], (0, P.pick)({
             enterprise: "10px",
             prisma: "14px"
-        }), r) : (0, $.css)([ "max-width:calc( 100% - ", " - ", " );" ], (0, _.pick)({
+        }), r) : (0, _.css)([ "max-width:calc( 100% - ", " - ", " );" ], (0, P.pick)({
             enterprise: "10px",
             prisma: "14px"
-        }), (0, _.pick)({
+        }), (0, P.pick)({
             enterprise: {
                 comfortable: "30px",
                 compact: "26px"
@@ -335,10 +351,10 @@
         })));
     }), (function(e) {
         var t = e.$hasBothAdornment, r = e.$endAdornmentWidth, n = e.$startAdornmentWidth;
-        return t && (0, $.css)([ "max-width:calc(100% - ", "px - ", "px);" ], n, r);
+        return t && (0, _.css)([ "max-width:calc(100% - ", "px - ", "px);" ], n, r);
     }));
-    var U = (0, $.css)([ "display:inline-flex;align-items:center;justify-content:center;height:", ";pointer-events:none;" ], (0, 
-    _.pick)({
+    var Z = (0, _.css)([ "display:inline-flex;align-items:center;justify-content:center;height:", ";pointer-events:none;" ], (0, 
+    P.pick)({
         enterprise: {
             comfortable: "30px",
             compact: "26px"
@@ -348,13 +364,13 @@
             compact: "30px"
         }
     }));
-    var J = D().div.withConfig({
+    var ee = D().div.withConfig({
         displayName: "TextAreaStyles__StyledStartAdornmentHolder",
-        componentId: "gfy8yp-7"
-    })([ "", " ", ";" ], U, (function(e) {
+        componentId: "gfy8yp-8"
+    })([ "", " ", ";" ], Z, (function(e) {
         var t = e.$width;
-        return t ? (0, $.css)([ "min-width:", "px;" ], t) : (0, $.css)([ "min-width:", ";" ], (0, 
-        _.pick)({
+        return t ? (0, _.css)([ "min-width:", "px;" ], t) : (0, _.css)([ "min-width:", ";" ], (0, 
+        P.pick)({
             enterprise: {
                 comfortable: "30px",
                 compact: "26px"
@@ -365,13 +381,13 @@
             }
         }));
     }));
-    var X = D().div.withConfig({
+    var te = D().div.withConfig({
         displayName: "TextAreaStyles__StyledEndAdornmentHolder",
-        componentId: "gfy8yp-8"
-    })([ "", " ", ";" ], U, (function(e) {
+        componentId: "gfy8yp-9"
+    })([ "", " ", ";" ], Z, (function(e) {
         var t = e.$width;
-        return t ? (0, $.css)([ "min-width:", "px;" ], t) : (0, $.css)([ "min-width:", ";" ], (0, 
-        _.pick)({
+        return t ? (0, _.css)([ "min-width:", "px;" ], t) : (0, _.css)([ "min-width:", ";" ], (0, 
+        P.pick)({
             enterprise: {
                 comfortable: "30px",
                 compact: "26px"
@@ -382,11 +398,11 @@
             }
         }));
     }));
-    var Y = D().div.withConfig({
+    var re = D().div.withConfig({
         displayName: "TextAreaStyles__StyledAdornment",
-        componentId: "gfy8yp-9"
+        componentId: "gfy8yp-10"
     })([ "display:inline-flex;align-items:center;justify-content:center;position:absolute;pointer-events:none;z-index:1;height:", ";color:", ";", ";", ";", "" ], (0, 
-    _.pick)({
+    P.pick)({
         enterprise: {
             comfortable: "30px",
             compact: "26px"
@@ -395,20 +411,20 @@
             comfortable: "38px",
             compact: "30px"
         }
-    }), (0, _.pick)({
+    }), (0, P.pick)({
         enterprise: {
-            light: _.variables.gray60,
-            dark: _.variables.white
+            light: P.variables.gray60,
+            dark: P.variables.white
         },
-        prisma: _.variables.contentColorMuted
+        prisma: P.variables.contentColorMuted
     }), (function(e) {
         var t = e.$position;
-        return t === "start" ? (0, $.css)([ "top:1px;left:1px;" ]) : (0, $.css)([ "top:1px;right:1px;" ]);
+        return t === "start" ? (0, _.css)([ "top:1px;left:1px;" ]) : (0, _.css)([ "top:1px;right:1px;" ]);
     }), (function(e) {
         var t = e.disabled;
-        return t && W;
-    }), (0, _.pick)({
-        enterprise: (0, $.css)([ "margin-left:-1px;margin-right:-1px;" ])
+        return t && B;
+    }), (0, P.pick)({
+        enterprise: (0, _.css)([ "margin-left:-1px;margin-right:-1px;" ])
     }));
     // CONCATENATED MODULE: ./src/TextArea/syncHeightWithShadow.ts
     // This file was adapted from [Call-Em-All's material-ui](https://github.com/mui-org/material-ui),
@@ -431,7 +447,7 @@
     // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
     // SOFTWARE.
     // End of MIT license text.
-    function Z(e) {
+    function ne(e) {
         var t = e.height, r = e.rowsMax, n = e.rowsMin, a = e.shadow;
         if (a) {
             var i = window.getComputedStyle(a);
@@ -445,7 +461,8 @@
             var c = parseInt(i.getPropertyValue("padding-bottom"), 10);
             var p = parseInt(i.getPropertyValue("border-top-width"), 10);
             var d = parseInt(i.getPropertyValue("border-bottom-width"), 10);
-            var u = a.scrollHeight + p + d;
+            var u = a.scrollHeight + p + d + 1;
+ // need one extra.
             /* eslint-disable no-restricted-globals */
             // Leverage the global `isNaN` here for IE support, rather than Number.isNaN.
             // We know newHeight is numeric because we parseInt() above, so `isNaN` should be reliable.
@@ -473,7 +490,7 @@
  * @param ref - The React callback or object ref. Can be `null` or `undefined`.
  * @param current - The new value of the ref.
  */
-    function ee(e, t) {
+    function ae(e, t) {
         if (e) {
             if (typeof e === "function") {
                 e(t);
@@ -486,21 +503,21 @@
         }
     }
     // CONCATENATED MODULE: ./src/TextArea/TextArea.tsx
-    function te(e) {
+    function ie(e) {
         "@babel/helpers - typeof";
         if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-            te = function e(t) {
+            ie = function e(t) {
                 return typeof t;
             };
         } else {
-            te = function e(t) {
+            ie = function e(t) {
                 return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
             };
         }
-        return te(e);
+        return ie(e);
     }
-    function re() {
-        re = Object.assign || function(e) {
+    function oe() {
+        oe = Object.assign || function(e) {
             for (var t = 1; t < arguments.length; t++) {
                 var r = arguments[t];
                 for (var n in r) {
@@ -511,36 +528,36 @@
             }
             return e;
         };
-        return re.apply(this, arguments);
+        return oe.apply(this, arguments);
     }
-    function ne(e) {
-        return le(e) || oe(e) || ie(e) || ae();
+    function le(e) {
+        return de(e) || pe(e) || ce(e) || se();
     }
-    function ae() {
+    function se() {
         throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
-    function ie(e, t) {
+    function ce(e, t) {
         if (!e) return;
-        if (typeof e === "string") return se(e, t);
+        if (typeof e === "string") return ue(e, t);
         var r = Object.prototype.toString.call(e).slice(8, -1);
         if (r === "Object" && e.constructor) r = e.constructor.name;
         if (r === "Map" || r === "Set") return Array.from(e);
-        if (r === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)) return se(e, t);
+        if (r === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)) return ue(e, t);
     }
-    function oe(e) {
+    function pe(e) {
         if (typeof Symbol !== "undefined" && Symbol.iterator in Object(e)) return Array.from(e);
     }
-    function le(e) {
-        if (Array.isArray(e)) return se(e);
+    function de(e) {
+        if (Array.isArray(e)) return ue(e);
     }
-    function se(e, t) {
+    function ue(e, t) {
         if (t == null || t > e.length) t = e.length;
         for (var r = 0, n = new Array(t); r < t; r++) {
             n[r] = e[r];
         }
         return n;
     }
-    function ce(e, t) {
+    function fe(e, t) {
         var r = Object.keys(e);
         if (Object.getOwnPropertySymbols) {
             var n = Object.getOwnPropertySymbols(e);
@@ -551,26 +568,26 @@
         }
         return r;
     }
-    function pe(e) {
+    function he(e) {
         for (var t = 1; t < arguments.length; t++) {
             var r = arguments[t] != null ? arguments[t] : {};
             if (t % 2) {
-                ce(Object(r), true).forEach((function(t) {
-                    ke(e, t, r[t]);
+                fe(Object(r), true).forEach((function(t) {
+                    Ie(e, t, r[t]);
                 }));
             } else if (Object.getOwnPropertyDescriptors) {
                 Object.defineProperties(e, Object.getOwnPropertyDescriptors(r));
             } else {
-                ce(Object(r)).forEach((function(t) {
+                fe(Object(r)).forEach((function(t) {
                     Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(r, t));
                 }));
             }
         }
         return e;
     }
-    function de(e, t) {
+    function ve(e, t) {
         if (e == null) return {};
-        var r = ue(e, t);
+        var r = me(e, t);
         var n, a;
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
@@ -583,7 +600,7 @@
         }
         return r;
     }
-    function ue(e, t) {
+    function me(e, t) {
         if (e == null) return {};
         var r = {};
         var n = Object.keys(e);
@@ -595,12 +612,12 @@
         }
         return r;
     }
-    function fe(e, t) {
+    function be(e, t) {
         if (!(e instanceof t)) {
             throw new TypeError("Cannot call a class as a function");
         }
     }
-    function he(e, t) {
+    function ye(e, t) {
         for (var r = 0; r < t.length; r++) {
             var n = t[r];
             n.enumerable = n.enumerable || false;
@@ -609,12 +626,12 @@
             Object.defineProperty(e, n.key, n);
         }
     }
-    function ve(e, t, r) {
-        if (t) he(e.prototype, t);
-        if (r) he(e, r);
+    function ge(e, t, r) {
+        if (t) ye(e.prototype, t);
+        if (r) ye(e, r);
         return e;
     }
-    function me(e, t) {
+    function xe(e, t) {
         if (typeof t !== "function" && t !== null) {
             throw new TypeError("Super expression must either be null or a function");
         }
@@ -625,41 +642,41 @@
                 configurable: true
             }
         });
-        if (t) be(e, t);
+        if (t) we(e, t);
     }
-    function be(e, t) {
-        be = Object.setPrototypeOf || function e(t, r) {
+    function we(e, t) {
+        we = Object.setPrototypeOf || function e(t, r) {
             t.__proto__ = r;
             return t;
         };
-        return be(e, t);
+        return we(e, t);
     }
-    function ye(e) {
-        var t = we();
+    function Ce(e) {
+        var t = Ae();
         return function r() {
-            var n = Ce(e), a;
+            var n = Oe(e), a;
             if (t) {
-                var i = Ce(this).constructor;
+                var i = Oe(this).constructor;
                 a = Reflect.construct(n, arguments, i);
             } else {
                 a = n.apply(this, arguments);
             }
-            return ge(this, a);
+            return ke(this, a);
         };
     }
-    function ge(e, t) {
-        if (t && (te(t) === "object" || typeof t === "function")) {
+    function ke(e, t) {
+        if (t && (ie(t) === "object" || typeof t === "function")) {
             return t;
         }
-        return xe(e);
+        return Se(e);
     }
-    function xe(e) {
+    function Se(e) {
         if (e === void 0) {
             throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
         }
         return e;
     }
-    function we() {
+    function Ae() {
         if (typeof Reflect === "undefined" || !Reflect.construct) return false;
         if (Reflect.construct.sham) return false;
         if (typeof Proxy === "function") return true;
@@ -670,13 +687,13 @@
             return false;
         }
     }
-    function Ce(e) {
-        Ce = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
+    function Oe(e) {
+        Oe = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
             return t.__proto__ || Object.getPrototypeOf(t);
         };
-        return Ce(e);
+        return Oe(e);
     }
-    function ke(e, t, r) {
+    function Ie(e, t, r) {
         if (t in e) {
             Object.defineProperty(e, t, {
                 value: r,
@@ -689,7 +706,7 @@
         }
         return e;
     }
-    /** @public */    var Se = {
+    /** @public */    var Ee = {
         appearance: i().oneOf([ "default", "search" ]),
         append: i().bool,
         autoCapitalize: i().string,
@@ -733,7 +750,7 @@
         splunkTheme: i().object,
         value: i().string
     };
-    var Ae = {
+    var je = {
         appearance: "default",
         append: false,
         autoFocus: false,
@@ -747,10 +764,10 @@
         rowsMin: 2,
         tabIndex: 0
     };
-    /** Note: TextArea places role and aria props onto the input. All other props are placed on the wrapper. */    var Oe =  function(e) {
-        me(r, e);
-        var t = ye(r);
-        ve(r, null, [ {
+    /** Note: TextArea places role and aria props onto the input. All other props are placed on the wrapper. */    var Te =  function(e) {
+        xe(r, e);
+        var t = Ce(r);
+        ge(r, null, [ {
             key: "validateRows",
             // @docs-props-type TextAreaPropsBase
             value: function e(t) {
@@ -760,14 +777,14 @@
         } ]);
         function r(e) {
             var a;
-            fe(this, r);
+            be(this, r);
             a = t.call(this, e);
-            ke(xe(a), "controlledExternally", void 0);
-            ke(xe(a), "input", null);
-            ke(xe(a), "shadow", null);
-            ke(xe(a), "startAdornment", null);
-            ke(xe(a), "endAdornment", null);
-            ke(xe(a), "getAdornmentWidth", (function() {
+            Ie(Se(a), "controlledExternally", void 0);
+            Ie(Se(a), "input", null);
+            Ie(Se(a), "shadow", null);
+            Ie(Se(a), "startAdornment", null);
+            Ie(Se(a), "endAdornment", null);
+            Ie(Se(a), "getAdornmentWidth", (function() {
                 var e = a.startAdornment ? a.startAdornment.getBoundingClientRect() : undefined;
                 var t = e && Math.round(e.width);
                 if (a.state.startAdornmentWidth !== t) {
@@ -783,14 +800,17 @@
                     });
                 }
             }));
-            ke(xe(a), "handleResize", (function() {
+            Ie(Se(a), "handleResize", (function() {
                 a.syncHeightWithShadow();
             }));
-            ke(xe(a), "handleInputMount", (function(e) {
+            Ie(Se(a), "handleInputMount", (function(e) {
                 a.input = e;
-                ee(a.props.inputRef, e);
+                ae(a.props.inputRef, e);
+            }));
+            Ie(Se(a), "handleShadowMount", (function(e) {
+                a.shadow = e;
             }));
-            ke(xe(a), "handleInputChange", (function(e) {
+            Ie(Se(a), "handleInputChange", (function(e) {
                 var t, r;
                 var n = e.target.value;
                 var i = a.props.name;
@@ -804,19 +824,19 @@
                     name: i
                 });
             }));
-            ke(xe(a), "handleInputKeyDown", (function(e) {
+            Ie(Se(a), "handleInputKeyDown", (function(e) {
                 var t, r;
                 (t = (r = a.props).onKeyDown) === null || t === void 0 ? void 0 : t.call(r, e);
             }));
-            ke(xe(a), "handleInputSelect", (function(e) {
+            Ie(Se(a), "handleInputSelect", (function(e) {
                 var t, r;
                 (t = (r = a.props).onSelect) === null || t === void 0 ? void 0 : t.call(r, e);
             }));
-            ke(xe(a), "handleInputClick", (function(e) {
+            Ie(Se(a), "handleInputClick", (function(e) {
                 var t, r;
                 (t = (r = a.props).onInputClick) === null || t === void 0 ? void 0 : t.call(r, e);
             }));
-            ke(xe(a), "handleInputFocus", (function(e) {
+            Ie(Se(a), "handleInputFocus", (function(e) {
                 var t, r;
                 var n = e.target.value;
                 var i = a.props.name;
@@ -825,7 +845,7 @@
                     name: i
                 });
             }));
-            ke(xe(a), "handleInputBlur", (function(e) {
+            Ie(Se(a), "handleInputBlur", (function(e) {
                 var t, r;
                 var n = e.target.value;
                 var i = a.props.name;
@@ -834,7 +854,7 @@
                     name: i
                 });
             }));
-            ke(xe(a), "handleClear", (function(e) {
+            Ie(Se(a), "handleClear", (function(e) {
                 var t, r;
                 e.preventDefault();
                 var n = "";
@@ -850,8 +870,8 @@
                     name: i
                 });
             }));
-            ke(xe(a), "syncHeightWithShadow", (function() {
-                var e = Z({
+            Ie(Se(a), "syncHeightWithShadow", (function() {
+                var e = ne({
                     height: a.state.height,
                     rowsMax: a.props.rowsMax,
                     rowsMin: a.props.rowsMin,
@@ -863,7 +883,7 @@
                     });
                 }
             }));
-            ke(xe(a), "renderEndAdornment", (function() {
+            Ie(Se(a), "renderEndAdornment", (function() {
                 var e;
                 var t = a.props, r = t.appearance, i = t.endAdornment, o = t.disabled, l = t.canClear, s = t.splunkTheme;
                 var c = s.isPrisma, p = s.isEnterprise, d = s.isCompact;
@@ -877,14 +897,14 @@
                 };
                 if (i) {
                     
-                    return n().createElement(Y, f, i);
+                    return n().createElement(re, f, i);
                 }
                 var h = a.context;
                 var v = (e = h.labelAttrs) === null || e === void 0 ? void 0 : e.text;
-                var m = v ? (0, M._)("Clear ".concat(v, " text field")) : (0, M._)("Clear text field");
+                var m = v ? (0, $._)("Clear ".concat(v, " text field")) : (0, $._)("Clear text field");
                 if (!c && r === "search") {
                     
-                    return n().createElement(Y, f,  n().createElement(F, {
+                    return n().createElement(re, f,  n().createElement(H, {
                         appearance: "pill",
                         "data-test": "clear",
                         inline: false,
@@ -893,14 +913,14 @@
                             screenReaderText: m
                         }),
                         onClick: a.handleClear
-                    }),  n().createElement(H, {
+                    }),  n().createElement(F, {
                         $disabled: o
                     }, p ?  n().createElement(O(), {
                         hideDefaultTooltip: true,
                         inline: false,
                         screenReaderText: null,
                         size: "16px"
-                    }) :  n().createElement(P(), {
+                    }) :  n().createElement(T(), {
                         height: u,
                         width: u
                     })));
@@ -908,7 +928,7 @@
                 var b = a.getDisplayValue();
                 if (!!b && (c && r === "search" || l)) {
                     
-                    return n().createElement(Y, f, !o &&  n().createElement(F, {
+                    return n().createElement(re, f, !o &&  n().createElement(H, {
                         "data-test": "clear",
                         appearance: "secondary",
                         onClick: a.handleClear,
@@ -922,7 +942,7 @@
                 }
                 return undefined;
             }));
-            ke(xe(a), "renderStartAdornment", (function() {
+            Ie(Se(a), "renderStartAdornment", (function() {
                 var e = a.props, t = e.appearance, r = e.startAdornment, i = e.splunkTheme, o = e.disabled;
                 var l = i.isPrisma, s = i.isCompact;
                 var c = s ? "20px" : "24px";
@@ -935,13 +955,13 @@
                 };
                 if (r) {
                     
-                    return n().createElement(Y, p, r);
+                    return n().createElement(re, p, r);
                 }
                 if (l && t === "search") {
                     
-                    return n().createElement(Y, p,  n().createElement(H, {
+                    return n().createElement(re, p,  n().createElement(F, {
                         $disabled: o
-                    },  n().createElement(P(), {
+                    },  n().createElement(T(), {
                         "aria-label": "Search",
                         height: c,
                         width: c
@@ -949,7 +969,7 @@
                 }
                 return undefined;
             }));
-            ke(xe(a), "getDisplayValue", (function() {
+            Ie(Se(a), "getDisplayValue", (function() {
                 var e = a.isControlled() ? a.props.value : a.state.value;
                 return e;
             }));
@@ -964,7 +984,7 @@
             a.handleResize = g()(a.handleResize, 100);
             return a;
         }
-        ve(r, [ {
+        ge(r, [ {
             key: "componentDidMount",
             value: function e() {
                 l()(this.syncHeightWithShadow);
@@ -1008,34 +1028,33 @@
         }, {
             key: "render",
             value: function e() {
-                var t = this;
-                var r = this.props, a = r.append, i = r.autoCapitalize, o = r.autoComplete, l = r.autoCorrect, s = r.autoFocus, c = r.children, p = r.className, u = r.classNamePrivate, h = r.disabled, m = r.describedBy, y = r.elementRef, g = r.error, x = r.inline, w = r.inputClassName, C = r.inputId, k = r.labelledBy, S = r.maxLength, A = r.name, O = r.placeholder, I = r.prepend, j = r.required, P = r.spellCheck, _ = r.tabIndex, M = r.title, $ = de(r, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "children", "className", "classNamePrivate", "disabled", "describedBy", "elementRef", "error", "inline", "inputClassName", "inputId", "labelledBy", "maxLength", "name", "placeholder", "prepend", "required", "spellCheck", "tabIndex", "title" ]);
-                var D = pe(pe({}, b()($, (function(e, t) {
+                var t = this.props, r = t.append, a = t.autoCapitalize, i = t.autoComplete, o = t.autoCorrect, l = t.autoFocus, s = t.children, c = t.className, p = t.classNamePrivate, u = t.disabled, h = t.describedBy, m = t.elementRef, y = t.error, g = t.inline, x = t.inputClassName, w = t.inputId, C = t.labelledBy, k = t.maxLength, S = t.name, A = t.placeholder, O = t.prepend, I = t.required, j = t.rowsMin, T = t.spellCheck, P = t.tabIndex, $ = t.title, _ = ve(t, [ "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 D = he(he({}, b()(_, (function(e, t) {
                     return t === "role" || t.indexOf("aria-") === 0;
                 }))), {}, {
-                    "aria-describedby": m,
-                    "aria-labelledby": k,
-                    "aria-invalid": g || undefined,
-                    "aria-multiline": true
+                    "aria-describedby": h,
+                    "aria-labelledby": C,
+                    "aria-invalid": y || undefined
                 });
-                var N = v()($, [ "inputRef", "onBlur", "onChange", "onFocus", "onKeyDown", "onSelect", "onInputClick", "rowsMax", "rowsMin" ].concat(ne(d()(D))));
+                var N = v()(_, [ "inputRef", "onBlur", "onChange", "onFocus", "onKeyDown", "onSelect", "onInputClick" ].concat(le(d()(D))));
                 var R = this.getDisplayValue();
                 var q = {
-                    className: (0, T.toClassName)(p, w),
-                    $append: a || undefined,
-                    $error: g,
-                    $prepend: I || undefined
+                    className: (0, M.toClassName)(c, x),
+                    $append: r || undefined,
+                    $error: y,
+                    $prepend: O || undefined
                 };
-                var B = pe(pe({}, D), {}, {
+                var W = he(he({}, D), {}, {
                     "data-test": "textbox",
-                    autoCapitalize: i,
-                    autoComplete: o,
-                    autoCorrect: l,
-                    autoFocus: s,
-                    id: C,
-                    maxLength: S,
-                    placeholder: O,
-                    name: A,
+                    autoCapitalize: a,
+                    autoComplete: i,
+                    autoCorrect: o,
+                    autoFocus: l,
+                    disabled: u,
+                    id: w,
+                    maxLength: k,
+                    placeholder: A,
+                    name: S,
                     onChange: this.handleInputChange,
                     onKeyDown: this.handleInputKeyDown,
                     onSelect: this.handleInputSelect,
@@ -1043,89 +1062,66 @@
                     onFocus: this.handleInputFocus,
                     onBlur: this.handleInputBlur,
                     ref: this.handleInputMount,
-                    role: "textbox",
-                    required: j,
-                    spellCheck: P,
+                    required: I,
+                    spellCheck: T,
                     style: {
                         height: this.state.height
                     },
-                    title: M,
-                    tabIndex: _,
+                    tabIndex: P,
+                    title: $,
                     value: R,
-                    $error: g
+                    $error: y
                 });
-                var W = !!this.renderEndAdornment();
+                var B = !!this.renderEndAdornment();
                 var z = !!this.renderStartAdornment();
                 
-                return n().createElement(V, re({
+                return n().createElement(V, oe({
                     tabIndex: -1,
-                    className: (0, T.toClassName)(p, u),
-                    "data-test": "text",
+                    className: (0, M.toClassName)(c, p),
+                    "data-test": "text-area",
                     "data-test-value": R,
-                    elementRef: y,
+                    elementRef: m,
                     flex: true,
-                    inline: x
-                }, N), this.renderStartAdornment(),  n().createElement(K, re({
-                    $hasEndAdornment: W,
+                    inline: g
+                }, N), this.renderStartAdornment(),  n().createElement(Q, oe({
+                    $hasEndAdornment: B,
                     $hasStartAdornment: z,
-                    disabled: h
-                }, q), z &&  n().createElement(J, {
+                    disabled: u
+                }, q), z &&  n().createElement(ee, {
                     $width: this.state.startAdornmentWidth
-                }),  n().createElement(L, {
+                }),  n().createElement(J, {
                     "aria-hidden": "true",
                     onChange: f(),
-                    onClick: this.handleInputClick,
-                    style: {
-                        width: "100%",
-                        position: "absolute",
-                        overflow: "hidden",
-                        left: -1e4,
-                        top: -1e4
-                    },
+                    $startAdornmentWidth: this.state.startAdornmentWidth,
+                    $endAdornmentWidth: this.state.endAdornmentWidth,
                     tabIndex: -1,
-                    ref: function e(r) {
-                        t.shadow = r;
-                    },
-                    value: R
-                }), h ?  n().createElement(L, re({
-                    as: "textarea",
-                    className: (0, T.toClassName)(p, u),
-                    "data-multiline": "true",
-                    "data-test": "text",
-                    disabled: true,
-                    readOnly: true,
-                    style: {
-                        height: this.state.height
-                    },
-                    value: R,
-                    placeholder: O,
-                    ref: function e(r) {
-                        t.shadow = r;
-                    }
-                }, D)) :  n().createElement(L, re({
-                    as: "textarea"
-                }, B, {
+                    rows: this.props.rowsMin,
+                    ref: this.handleShadowMount,
+                    value: A && !R ? A : R
+                }),  n().createElement(U, oe({
+                    $rowsMin: j
+                }, W, {
                     onClick: this.handleInputClick
                 })),  n().createElement(E(), {
                     target: window,
                     eventType: "resize",
                     listener: this.handleResize
-                }), c, W &&  n().createElement(X, {
+                }), s, B &&  n().createElement(te, {
                     $width: this.state.endAdornmentWidth
                 })), this.renderEndAdornment());
             }
         } ]);
         return r;
     }(r.Component);
-    ke(Oe, "propTypes", Se);
-    ke(Oe, "defaultProps", Ae);
-    ke(Oe, "componentType", "TextArea");
-    ke(Oe, "contextType", x.ControlGroupContext);
-    var Ie = (0, _.withSplunkTheme)(Oe);
-    var Ee = Ie;
-    Ee.propTypes = Oe.propTypes;
-    Ee.componentType = Oe.componentType;
-    /* harmony default export */    const je = Ee;
+    Ie(Te, "propTypes", Ee);
+    Ie(Te, "defaultProps", je);
+    Ie(Te, "componentType", "TextArea");
+    Ie(Te, "contextType", x.ControlGroupContext);
+    var Me = (0, P.withSplunkTheme)(Te);
+    var Pe = Me;
+    Pe.propTypes = Te.propTypes;
+    Pe.componentType = Te.componentType;
+    /* harmony default export */    const $e = Pe;
     // CONCATENATED MODULE: ./src/TextArea/index.ts
     module.exports = t;
     /******/})();