@splunk/react-ui 5.2.0 → 5.3.0

package/TextArea.js

@@ -3,19 +3,19 @@
     /******/ "use strict";
     /******/    var e = {
         /***/ 3639: 
-        /***/ (e, r, t) => {
+        /***/ (e, r, n) => {
             // EXPORTS
-            t.d(r, {
+            n.d(r, {
                 default: () => /* reexport */ s
             });
             // UNUSED EXPORTS: isAllowedType, isPrimitive
             // EXTERNAL MODULE: external "react"
-                        var n = t(9497);
+                        var t = n(9497);
             // CONCATENATED MODULE: external "lodash/isEqual"
             const o = require("lodash/isEqual");
             // EXTERNAL MODULE: external "lodash/has"
-                        var a = t(5919);
-            var i =  t.n(a);
+                        var a = n(5919);
+            var i =  n.n(a);
             // CONCATENATED MODULE: ./src/useControlled/useControlled.tsx
             function l(e) {
                 return e === null || e === undefined || typeof e === "boolean" || typeof e === "string" || typeof e === "number";
@@ -39,13 +39,13 @@
  *
  * Return the controlled state of the component.
  */            function c(e) {
-                var r = e.componentProps, t = e.componentName, o = t === void 0 ? "this component" : t, a = e.defaultValuePropName, l = a === void 0 ? "defaultValue" : a, u = e.valuePropName, c = u === void 0 ? "value" : u;
-                var s = (0, n.useRef)(i()(r, c));
-                var d = (0, n.useRef)(r[l]);
-                (0, n.useEffect)((function() {
+                var r = e.componentProps, n = e.componentName, o = n === void 0 ? "this component" : n, a = e.defaultValuePropName, l = a === void 0 ? "defaultValue" : a, u = e.valuePropName, c = u === void 0 ? "value" : u;
+                var s = (0, t.useRef)(i()(r, c));
+                var d = (0, t.useRef)(r[l]);
+                (0, t.useEffect)((function() {
                     if (false) {}
                 }), [ o, r, l, c ]);
-                (0, n.useEffect)((function() {
+                (0, t.useEffect)((function() {
                     if (false) {}
                     if (false) {}
                     if (false) {}
@@ -70,21 +70,21 @@
     /******/    var r = {};
     /******/
     /******/ // The require function
-    /******/    function t(n) {
+    /******/    function n(t) {
         /******/ // Check if module is in cache
-        /******/ var o = r[n];
+        /******/ var o = r[t];
         /******/        if (o !== undefined) {
             /******/ return o.exports;
             /******/        }
         /******/ // Create a new module (and put it into the cache)
-        /******/        var a = r[n] = {
+        /******/        var a = r[t] = {
             /******/ // no module.id needed
             /******/ // no module.loaded needed
             /******/ exports: {}
             /******/        };
         /******/
         /******/ // Execute the module function
-        /******/        e[n](a, a.exports, t);
+        /******/        e[t](a, a.exports, n);
         /******/
         /******/ // Return the exports of the module
         /******/        return a.exports;
@@ -94,12 +94,12 @@
     /******/ /* webpack/runtime/compat get default export */
     /******/    (() => {
         /******/ // getDefaultExport function for compatibility with non-harmony modules
-        /******/ t.n = e => {
+        /******/ n.n = e => {
             /******/ var r = e && e.__esModule ? 
             /******/ () => e["default"]
             /******/ : () => e
             /******/;
-            t.d(r, {
+            n.d(r, {
                 a: r
             });
             /******/            return r;
@@ -109,12 +109,12 @@
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ t.d = (e, r) => {
-            /******/ for (var n in r) {
-                /******/ if (t.o(r, n) && !t.o(e, n)) {
-                    /******/ Object.defineProperty(e, n, {
+        /******/ n.d = (e, r) => {
+            /******/ for (var t in r) {
+                /******/ if (n.o(r, t) && !n.o(e, t)) {
+                    /******/ Object.defineProperty(e, t, {
                         enumerable: true,
-                        get: r[n]
+                        get: r[t]
                     });
                     /******/                }
                 /******/            }
@@ -123,14 +123,14 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ t.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
+        /******/ n.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
         /******/;
     })();
     /******/
     /******/ /* webpack/runtime/make namespace object */
     /******/    (() => {
         /******/ // define __esModule on exports
-        /******/ t.r = e => {
+        /******/ n.r = e => {
             /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
                 /******/ Object.defineProperty(e, Symbol.toStringTag, {
                     value: "Module"
@@ -142,36 +142,36 @@
             /******/        };
         /******/    })();
     /******/
-    /************************************************************************/    var n = {};
+    /************************************************************************/    var t = {};
     // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
         (() => {
         // ESM COMPAT FLAG
-        t.r(n);
+        n.r(t);
         // EXPORTS
-                t.d(n, {
-            default: () => /* reexport */ ue
+                n.d(t, {
+            default: () => /* reexport */ se
         });
         // EXTERNAL MODULE: external "react"
-                var e = t(9497);
-        var r =  t.n(e);
+                var e = n(9497);
+        var r =  n.n(e);
         // CONCATENATED MODULE: external "lodash/keys"
         const o = require("lodash/keys");
-        var a =  t.n(o);
+        var a =  n.n(o);
         // CONCATENATED MODULE: external "lodash/omit"
         const i = require("lodash/omit");
-        var l =  t.n(i);
+        var l =  n.n(i);
         // CONCATENATED MODULE: external "lodash/pickBy"
         const u = require("lodash/pickBy");
-        var c =  t.n(u);
+        var c =  n.n(u);
         // CONCATENATED MODULE: external "lodash/throttle"
         const s = require("lodash/throttle");
-        var d =  t.n(s);
+        var d =  n.n(s);
         // CONCATENATED MODULE: external "prop-types"
         const f = require("prop-types");
-        var p =  t.n(f);
+        var p =  n.n(f);
         // CONCATENATED MODULE: external "@splunk/react-ui/EventListener"
         const v = require("@splunk/react-ui/EventListener");
-        var b =  t.n(v);
+        var m =  n.n(v);
         // CONCATENATED MODULE: ./src/TextArea/syncHeightWithShadow.ts
         // This file was adapted from [Call-Em-All's material-ui](https://github.com/mui-org/material-ui),
         // which is MIT-licensed:
@@ -193,8 +193,8 @@
         // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
         // SOFTWARE.
         // End of MIT license text.
-        function m(e) {
-            var r = e.height, t = e.rowsMax, n = e.rowsMin, o = e.shadow;
+        function b(e) {
+            var r = e.height, n = e.rowsMax, t = e.rowsMin, o = e.shadow;
             if (o) {
                 var a = window.getComputedStyle(o);
                 var i = a.getPropertyValue("line-height");
@@ -203,49 +203,51 @@
                     return false;
                 }
                 var l = parseInt(i, 10);
-                var u = parseInt(a.getPropertyValue("padding-top"), 10);
-                var c = parseInt(a.getPropertyValue("padding-bottom"), 10);
-                var s = parseInt(a.getPropertyValue("border-top-width"), 10);
-                var d = parseInt(a.getPropertyValue("border-bottom-width"), 10);
-                var f = o.scrollHeight + s + d;
+                var u = parseInt(a.getPropertyValue("border-top-width"), 10);
+                var c = parseInt(a.getPropertyValue("border-bottom-width"), 10);
+                var s = o.scrollHeight + u + c;
                 /* 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.
-                                if (f === undefined || isNaN(f)) {
+                                if (s === undefined || isNaN(s)) {
                     return false;
                 }
-                /* eslint-enable no-restricted-globals */                if (t >= n) {
-                    var p = t * l + u + c + s + d;
-                    f = Math.min(p, f);
+                /* eslint-enable no-restricted-globals */                if (n >= t) {
+                    var d = n * l + u + c;
+                    s = Math.min(d, s);
                 }
-                var v = n * l + u + c + s + d;
-                f = Math.max(v, f);
-                if (r !== f) {
-                    return f;
+                var f = t * l + u + c;
+                s = Math.max(f, s);
+                if (r !== s) {
+                    return s;
                 }
             }
             return false;
         }
         // CONCATENATED MODULE: external "styled-components"
         const y = require("styled-components");
-        var h =  t.n(y);
+        var h =  n.n(y);
         // CONCATENATED MODULE: external "@splunk/react-ui/Box"
         const g = require("@splunk/react-ui/Box");
-        var x =  t.n(g);
+        var w =  n.n(g);
         // CONCATENATED MODULE: external "@splunk/themes"
-        const w = require("@splunk/themes");
+        const x = require("@splunk/themes");
         // CONCATENATED MODULE: ./src/TextArea/TextAreaStyles.ts
         var C = "230px";
-        var S = w.variables.spacingSmall;
-        // Because the height cannot be set from variables.inputHeight with the syncHeight/auto expanding rows
-        // the value here is set to be custom to ensure the correct total height across row values
-                var O = "5px";
-        var A = h()(x()).withConfig({
+        var S = x.variables.spacingSmall;
+        // variables.inputHeight can't be used with syncHeight/auto-expanding rows.
+        // Use a custom value here to ensure the single-line TextArea matches the Text height
+        // and keeps the vertical spacing above the label consistent (SUI-8053).
+                var A = (0, x.pick)({
+            comfortable: "5px",
+            compact: "3px"
+        });
+        var O = h()(w()).withConfig({
             displayName: "TextAreaStyles__StyledBox",
             componentId: "gfy8yp-0"
-        })([ "", " display:flex;justify-content:space-between;flex-grow:1;flex-shrink:1;position:relative;min-height:", ";overflow:hidden;border:", " solid ", ";border-radius:", ";box-sizing:border-box;background-color:", ";box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);align-items:center;gap:", ";padding:0 ", ";&:hover:not([disabled]){border-color:", ";}&:not([disabled]):has(textarea:focus){box-shadow:", ";color:", ";}", " ", " ", " ", " &[data-inline]{width:", ";flex-basis:", ";}" ], w.mixins.reset("inline-flex"), w.variables.inputHeight, w.variables.inputBorderWidth, w.variables.interactiveColorBorder, w.variables.borderRadius, w.variables.interactiveColorBackground, w.variables.spacingSmall, S, w.variables.interactiveColorBorderHover, w.variables.focusShadow, w.variables.contentColorActive, (function(e) {
+        })([ "display:grid;grid-template-columns:[startAdornment] min-content [content] minmax(0,1fr) [endAdornment] min-content;position:relative;min-height:", ";overflow:hidden;border:", " solid ", ";border-radius:", ";background-color:", ";box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);align-items:center;padding:", " ", ";&:hover:not([disabled]){border-color:", ";}&:not([disabled]):has(textarea:focus){box-shadow:", ";color:", ";}", " ", " ", " ", " ", "" ], x.variables.inputHeight, x.variables.inputBorderWidth, x.variables.interactiveColorBorder, x.variables.borderRadius, x.variables.interactiveColorBackground, A, S, x.variables.interactiveColorBorderHover, x.variables.focusShadow, x.variables.contentColorActive, (function(e) {
             var r = e.$error;
-            return r && (0, y.css)([ "border-color:", ";&:hover:not([disabled]){border-color:", ";}" ], w.variables.interactiveColorAccentError, w.variables.interactiveColorAccentErrorStrong);
+            return r && (0, y.css)([ "border-color:", ";&:hover:not([disabled]){border-color:", ";}" ], x.variables.interactiveColorAccentError, x.variables.interactiveColorAccentErrorStrong);
         }), (function(e) {
             var r = e.$append;
             return r && (0, y.css)([ "margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0;border-right:none;" ]);
@@ -254,37 +256,45 @@
             return r && (0, y.css)([ "border-top-left-radius:0;border-bottom-left-radius:0;" ]);
         }), (function(e) {
             var r = e.disabled;
-            return r && (0, y.css)([ "background-color:", ";border-color:", ";box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);" ], w.variables.interactiveColorBackgroundDisabled, w.variables.interactiveColorBorderDisabled);
-        }), C, C);
+            return r && (0, y.css)([ "background-color:", ";border-color:", ";box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);" ], x.variables.interactiveColorBackgroundDisabled, x.variables.interactiveColorBorderDisabled);
+        }), (function(e) {
+            var r = e.$inline;
+            return r && (0, y.css)([ "display:inline-grid;width:", ";" ], C);
+        }));
         // This wrapper ensures the textarea and shadow text area are the same width.
-        // The wrapper's size is determined by the parent flex layout: the textarea and shadow
+        // The wrapper's size is determined by the parent grid layout: the textarea and shadow
         // are both set to be 100% of the wrapper.
         // Having the same width is necessary for the height to be calculated correctly
         // so that the value wrapping behavior is correct
                 var E = h().div.withConfig({
             displayName: "TextAreaStyles__StyledTextAreaAndShadowWrapper",
             componentId: "gfy8yp-1"
-        })([ "", ";position:relative;overflow:hidden;flex-grow:1;" ], w.mixins.reset("inline-flex"));
+        })([ "", ";position:relative;overflow:hidden;flex-grow:1;grid-column:content;" ], x.mixins.reset("inline-flex"));
         var j = h().textarea.withConfig({
             displayName: "TextAreaStyles__StyledTextArea",
             componentId: "gfy8yp-2"
-        })([ "", ";color:", ";position:relative;resize:none;overflow:auto;white-space:pre-wrap;width:100%;line-height:20px;padding-top:", ";padding-bottom:", ";&::placeholder{color:", ";opacity:1;}&[disabled]{cursor:not-allowed;color:", ";&::placeholder{color:", ";}}" ], w.mixins.reset(), w.variables.contentColorActive, O, O, w.variables.contentColorMuted, w.variables.contentColorDisabled, w.variables.contentColorDisabled);
+        })([ "", ";color:", ";position:relative;resize:none;overflow:auto;white-space:pre-wrap;width:100%;line-height:20px;&::placeholder{color:", ";opacity:1;}&[disabled]{cursor:not-allowed;color:", ";&::placeholder{color:", ";}}" ], x.mixins.reset(), x.variables.contentColorActive, x.variables.contentColorMuted, x.variables.contentColorDisabled, x.variables.contentColorDisabled);
         var I = h()(j).withConfig({
             displayName: "TextAreaStyles__StyledTextAreaShadow",
             componentId: "gfy8yp-3"
         })([ "position:absolute;overflow:hidden;left:-10000px;top:-10000px;visibility:hidden;pointer-events:none;" ]);
-        var k = h().div.withConfig({
-            displayName: "TextAreaStyles__StyledAdornment",
-            componentId: "gfy8yp-4"
-        })([ "align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;pointer-events:none;color:", ";padding:", " 0;", ";" ], w.variables.contentColorMuted, O, (function(e) {
+        var k = (0, y.css)([ "display:inline-flex;min-height:1lh;align-self:start;align-items:center;justify-content:center;pointer-events:none;color:", ";", ";" ], x.variables.contentColorMuted, (function(e) {
             var r = e.$disabled;
-            return r && (0, y.css)([ "cursor:not-allowed;color:", ";" ], w.variables.contentColorDisabled);
+            return r && (0, y.css)([ "cursor:not-allowed;color:", ";" ], x.variables.contentColorDisabled);
         }));
+        var T = h().div.withConfig({
+            displayName: "TextAreaStyles__StyledStartAdornment",
+            componentId: "gfy8yp-4"
+        })([ "", " grid-column:startAdornment;margin-inline-end:", ";" ], k, x.variables.spacingSmall);
+        var P = h().div.withConfig({
+            displayName: "TextAreaStyles__StyledEndAdornment",
+            componentId: "gfy8yp-5"
+        })([ "", " grid-column:endAdornment;margin-inline-start:", ";" ], k, x.variables.spacingSmall);
         // EXTERNAL MODULE: ./src/useControlled/index.ts + 2 modules
-                var P = t(3639);
+                var B = n(3639);
         // CONCATENATED MODULE: ./src/utils/ssrDocument.ts
         /* eslint-disable @typescript-eslint/no-empty-function */
-        var T = {
+        var N = {
             body: {
                 appendChild: function e() {
                     return [];
@@ -338,16 +348,16 @@
                 search: ""
             }
         };
-        function B() {
-            var e = typeof document !== "undefined" ? document : T;
+        function q() {
+            var e = typeof document !== "undefined" ? document : N;
             return e;
         }
-        var N = B();
-        /* harmony default export */        const q = /* unused pure expression or super */ null && N;
+        var M = q();
+        /* harmony default export */        const _ = /* unused pure expression or super */ null && M;
         // CONCATENATED MODULE: ./src/utils/ssrWindow.ts
         /* eslint-disable @typescript-eslint/no-empty-function */
-        var M = {
-            document: T,
+        var D = {
+            document: N,
             navigator: {
                 userAgent: ""
             },
@@ -401,12 +411,12 @@
                 clearTimeout(r);
             }
         };
-        function D() {
-            var e = typeof window !== "undefined" ? window : M;
+        function R() {
+            var e = typeof window !== "undefined" ? window : D;
             return e;
         }
-        var _ = D();
-        /* harmony default export */        const R = _;
+        var $ = R();
+        /* harmony default export */        const F = $;
         // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
         /**
  * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
@@ -414,7 +424,7 @@
  * @param ref - The React callback or object ref. Can be `null` or `undefined`.
  * @param current - The new value of the ref.
  */
-        function F(e, r) {
+        function L(e, r) {
             if (e) {
                 if (typeof e === "function") {
                     e(r);
@@ -435,107 +445,107 @@
                 return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
             }, V(e);
         }
-        function $() {
-            return $ = Object.assign ? Object.assign.bind() : function(e) {
+        function z() {
+            return z = Object.assign ? Object.assign.bind() : function(e) {
                 for (var r = 1; r < arguments.length; r++) {
-                    var t = arguments[r];
-                    for (var n in t) {
-                        ({}).hasOwnProperty.call(t, n) && (e[n] = t[n]);
+                    var n = arguments[r];
+                    for (var t in n) {
+                        ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
                     }
                 }
                 return e;
-            }, $.apply(null, arguments);
+            }, z.apply(null, arguments);
         }
-        function L(e) {
-            return H(e) || K(e) || Z(e) || z();
+        function K(e) {
+            return U(e) || W(e) || re(e) || H();
         }
-        function z() {
+        function H() {
             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 K(e) {
+        function W(e) {
             if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
         }
-        function H(e) {
-            if (Array.isArray(e)) return ee(e);
+        function U(e) {
+            if (Array.isArray(e)) return ne(e);
         }
-        function W(e, r) {
-            var t = Object.keys(e);
+        function G(e, r) {
+            var n = Object.keys(e);
             if (Object.getOwnPropertySymbols) {
-                var n = Object.getOwnPropertySymbols(e);
-                r && (n = n.filter((function(r) {
+                var t = Object.getOwnPropertySymbols(e);
+                r && (t = t.filter((function(r) {
                     return Object.getOwnPropertyDescriptor(e, r).enumerable;
-                }))), t.push.apply(t, n);
+                }))), n.push.apply(n, t);
             }
-            return t;
+            return n;
         }
-        function U(e) {
+        function J(e) {
             for (var r = 1; r < arguments.length; r++) {
-                var t = null != arguments[r] ? arguments[r] : {};
-                r % 2 ? W(Object(t), !0).forEach((function(r) {
-                    G(e, r, t[r]);
-                })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : W(Object(t)).forEach((function(r) {
-                    Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+                var n = null != arguments[r] ? arguments[r] : {};
+                r % 2 ? G(Object(n), !0).forEach((function(r) {
+                    Q(e, r, n[r]);
+                })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : G(Object(n)).forEach((function(r) {
+                    Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(n, r));
                 }));
             }
             return e;
         }
-        function G(e, r, t) {
-            return (r = J(r)) in e ? Object.defineProperty(e, r, {
-                value: t,
+        function Q(e, r, n) {
+            return (r = X(r)) in e ? Object.defineProperty(e, r, {
+                value: n,
                 enumerable: !0,
                 configurable: !0,
                 writable: !0
-            }) : e[r] = t, e;
+            }) : e[r] = n, e;
         }
-        function J(e) {
-            var r = Q(e, "string");
+        function X(e) {
+            var r = Y(e, "string");
             return "symbol" == V(r) ? r : r + "";
         }
-        function Q(e, r) {
+        function Y(e, r) {
             if ("object" != V(e) || !e) return e;
-            var t = e[Symbol.toPrimitive];
-            if (void 0 !== t) {
-                var n = t.call(e, r || "default");
-                if ("object" != V(n)) return n;
+            var n = e[Symbol.toPrimitive];
+            if (void 0 !== n) {
+                var t = n.call(e, r || "default");
+                if ("object" != V(t)) return t;
                 throw new TypeError("@@toPrimitive must return a primitive value.");
             }
             return ("string" === r ? String : Number)(e);
         }
-        function X(e, r) {
-            return te(e) || re(e, r) || Z(e, r) || Y();
+        function Z(e, r) {
+            return oe(e) || te(e, r) || re(e, r) || ee();
         }
-        function Y() {
+        function ee() {
             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 Z(e, r) {
+        function re(e, r) {
             if (e) {
-                if ("string" == typeof e) return ee(e, r);
-                var t = {}.toString.call(e).slice(8, -1);
-                return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? ee(e, r) : void 0;
+                if ("string" == typeof e) return ne(e, r);
+                var n = {}.toString.call(e).slice(8, -1);
+                return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? ne(e, r) : void 0;
             }
         }
-        function ee(e, r) {
+        function ne(e, r) {
             (null == r || r > e.length) && (r = e.length);
-            for (var t = 0, n = Array(r); t < r; t++) {
-                n[t] = e[t];
+            for (var n = 0, t = Array(r); n < r; n++) {
+                t[n] = e[n];
             }
-            return n;
+            return t;
         }
-        function re(e, r) {
-            var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-            if (null != t) {
-                var n, o, a, i, l = [], u = !0, c = !1;
+        function te(e, r) {
+            var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+            if (null != n) {
+                var t, o, a, i, l = [], u = !0, c = !1;
                 try {
-                    if (a = (t = t.call(e)).next, 0 === r) {
-                        if (Object(t) !== t) return;
+                    if (a = (n = n.call(e)).next, 0 === r) {
+                        if (Object(n) !== n) return;
                         u = !1;
-                    } else for (;!(u = (n = a.call(t)).done) && (l.push(n.value), l.length !== r); u = !0) {
+                    } else for (;!(u = (t = a.call(n)).done) && (l.push(t.value), l.length !== r); u = !0) {
                     }
                 } catch (e) {
                     c = !0, o = e;
                 } finally {
                     try {
-                        if (!u && null != t["return"] && (i = t["return"](), Object(i) !== i)) return;
+                        if (!u && null != n["return"] && (i = n["return"](), Object(i) !== i)) return;
                     } finally {
                         if (c) throw o;
                     }
@@ -543,34 +553,34 @@
                 return l;
             }
         }
-        function te(e) {
+        function oe(e) {
             if (Array.isArray(e)) return e;
         }
-        function ne(e, r) {
+        function ae(e, r) {
             if (null == e) return {};
-            var t, n, o = oe(e, r);
+            var n, t, o = ie(e, r);
             if (Object.getOwnPropertySymbols) {
                 var a = Object.getOwnPropertySymbols(e);
-                for (n = 0; n < a.length; n++) {
-                    t = a[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (o[t] = e[t]);
+                for (t = 0; t < a.length; t++) {
+                    n = a[t], -1 === r.indexOf(n) && {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
                 }
             }
             return o;
         }
-        function oe(e, r) {
+        function ie(e, r) {
             if (null == e) return {};
-            var t = {};
-            for (var n in e) {
-                if ({}.hasOwnProperty.call(e, n)) {
-                    if (-1 !== r.indexOf(n)) continue;
-                    t[n] = e[n];
+            var n = {};
+            for (var t in e) {
+                if ({}.hasOwnProperty.call(e, t)) {
+                    if (-1 !== r.indexOf(t)) continue;
+                    n[t] = e[t];
                 }
             }
-            return t;
+            return n;
         }
         /** @public */
         /** @public */
-        /** @public */        var ae = {
+        /** @public */        var le = {
             append: p().bool,
             autoCapitalize: p().string,
             autoComplete: p().string,
@@ -607,151 +617,150 @@
             startAdornment: p().node,
             value: p().string
         };
-        var ie = function e() {};
-        /** Note: TextArea places role and aria props onto the input. All other props are placed on the wrapper. */        function le(t) {
-            var n = t.append, o = n === void 0 ? false : n, i = t.autoCapitalize, u = t.autoComplete, s = t.autoCorrect, f = t.autoFocus, p = f === void 0 ? false : f, v = t.children, y = t.disabled, h = y === void 0 ? false : y, g = t.describedBy, x = t.defaultValue, w = t.elementRef, C = t.error, S = C === void 0 ? false : C, O = t.endAdornment, T = t.inline, B = T === void 0 ? false : T, N = t.inputClassName, q = t.inputId, M = t.inputRef, D = t.labelledBy, _ = t.maxLength, V = t.name, z = t.onBlur, K = t.onChange, H = t.onFocus, W = t.onInputClick, G = t.onKeyDown, J = t.onSelect, Q = t.placeholder, Y = t.prepend, Z = Y === void 0 ? false : Y, ee = t.required, re = t.rowsMin, te = re === void 0 ? 2 : re, oe = t.rowsMax, ae = oe === void 0 ? 8 : oe, le = t.spellCheck, ue = t.startAdornment, ce = t.tabIndex, se = ce === void 0 ? 0 : ce, de = t.value, fe = ne(t, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "children", "disabled", "describedBy", "defaultValue", "elementRef", "error", "endAdornment", "inline", "inputClassName", "inputId", "inputRef", "labelledBy", "maxLength", "name", "onBlur", "onChange", "onFocus", "onInputClick", "onKeyDown", "onSelect", "placeholder", "prepend", "required", "rowsMin", "rowsMax", "spellCheck", "startAdornment", "tabIndex", "value" ]);
+        var ue = function e() {};
+        /** Note: TextArea places role and aria props onto the input. All other props are placed on the wrapper. */        function ce(n) {
+            var t = n.append, o = t === void 0 ? false : t, i = n.autoCapitalize, u = n.autoComplete, s = n.autoCorrect, f = n.autoFocus, p = f === void 0 ? false : f, v = n.children, y = n.disabled, h = y === void 0 ? false : y, g = n.describedBy, w = n.defaultValue, x = n.elementRef, C = n.error, S = C === void 0 ? false : C, A = n.endAdornment, k = n.inline, N = k === void 0 ? false : k, q = n.inputClassName, M = n.inputId, _ = n.inputRef, D = n.labelledBy, R = n.maxLength, $ = n.name, V = n.onBlur, H = n.onChange, W = n.onFocus, U = n.onInputClick, G = n.onKeyDown, Q = n.onSelect, X = n.placeholder, Y = n.prepend, ee = Y === void 0 ? false : Y, re = n.required, ne = n.rowsMin, te = ne === void 0 ? 2 : ne, oe = n.rowsMax, ie = oe === void 0 ? 8 : oe, le = n.spellCheck, ce = n.startAdornment, se = n.tabIndex, de = se === void 0 ? 0 : se, fe = n.value, pe = ae(n, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "children", "disabled", "describedBy", "defaultValue", "elementRef", "error", "endAdornment", "inline", "inputClassName", "inputId", "inputRef", "labelledBy", "maxLength", "name", "onBlur", "onChange", "onFocus", "onInputClick", "onKeyDown", "onSelect", "placeholder", "prepend", "required", "rowsMin", "rowsMax", "spellCheck", "startAdornment", "tabIndex", "value" ]);
             // @docs-props-type TextAreaPropsBase
                         (0, e.useEffect)((function() {
                 if (false) {}
-            }), [ te, ae ]);
-            var pe = (0, P["default"])({
+            }), [ te, ie ]);
+            var ve = (0, B["default"])({
                 componentName: "TextArea",
                 /* eslint-disable-next-line prefer-rest-params */
                 componentProps: arguments[0]
             });
-            var ve = (0, e.useState)(x || ""), be = X(ve, 2), me = be[0], ye = be[1];
-            var he = (0, e.useState)(), ge = X(he, 2), xe = ge[0], we = ge[1];
-            var Ce = (0, e.useRef)(null);
+            var me = (0, e.useState)(w || ""), be = Z(me, 2), ye = be[0], he = be[1];
+            var ge = (0, e.useState)(), we = Z(ge, 2), xe = we[0], Ce = we[1];
             var Se = (0, e.useRef)(null);
-            var Oe = pe ? de : me;
-            var Ae = (0, e.useCallback)((function(e) {
-                Ce.current = e;
-                F(M, e);
-            }), [ M, Ce ]);
+            var Ae = (0, e.useRef)(null);
+            var Oe = ve ? fe : ye;
             var Ee = (0, e.useCallback)((function(e) {
+                Se.current = e;
+                L(_, e);
+            }), [ _, Se ]);
+            var je = (0, e.useCallback)((function(e) {
                 G === null || G === void 0 ? void 0 : G(e);
             }), [ G ]);
-            var je = (0, e.useCallback)((function(e) {
-                J === null || J === void 0 ? void 0 : J(e);
-            }), [ J ]);
             var Ie = (0, e.useCallback)((function(e) {
-                W === null || W === void 0 ? void 0 : W(e);
-            }), [ W ]);
+                Q === null || Q === void 0 ? void 0 : Q(e);
+            }), [ Q ]);
             var ke = (0, e.useCallback)((function(e) {
+                U === null || U === void 0 ? void 0 : U(e);
+            }), [ U ]);
+            var Te = (0, e.useCallback)((function(e) {
                 var r = e.target.value;
-                H === null || H === void 0 ? void 0 : H(e, {
+                W === null || W === void 0 ? void 0 : W(e, {
                     value: r,
-                    name: V
+                    name: $
                 });
-            }), [ V, H ]);
+            }), [ $, W ]);
             var Pe = (0, e.useCallback)((function(e) {
                 var r = e.target.value;
-                z === null || z === void 0 ? void 0 : z(e, {
+                V === null || V === void 0 ? void 0 : V(e, {
                     value: r,
-                    name: V
+                    name: $
                 });
-            }), [ V, z ]);
-            var Te = (0, e.useCallback)((function(e) {
+            }), [ $, V ]);
+            var Be = (0, e.useCallback)((function(e) {
                 var r = e.target.value;
-                if (!pe) {
-                    ye(r);
+                if (!ve) {
+                    he(r);
                 }
-                K === null || K === void 0 ? void 0 : K(e, {
+                H === null || H === void 0 ? void 0 : H(e, {
                     value: r,
-                    name: V
+                    name: $
                 });
-            }), [ K, ye, pe, V ]);
-            var Be = (0, e.useCallback)((function() {
-                var e = m({
+            }), [ H, he, ve, $ ]);
+            var Ne = (0, e.useCallback)((function() {
+                var e = b({
                     height: xe,
-                    rowsMax: ae,
+                    rowsMax: ie,
                     rowsMin: te,
-                    shadow: Se.current
+                    shadow: Ae.current
                 });
                 if (e !== false) {
-                    we(e);
+                    Ce(e);
                 }
-            }), [ we, Se, ae, te, xe ]);
-            var Ne = (0, e.useMemo)((function() {
-                return d()(Be, 100);
-            }), [ Be ]);
+            }), [ Ce, Ae, ie, te, xe ]);
+            var qe = (0, e.useMemo)((function() {
+                return d()(Ne, 100);
+            }), [ Ne ]);
             (0, e.useLayoutEffect)((function() {
-                Be();
+                Ne();
             }));
-            var qe = U(U({}, c()(fe, (function(e, r) {
+            var Me = J(J({}, c()(pe, (function(e, r) {
                 return r === "role" || r.indexOf("aria-") === 0;
             }))), {}, {
                 "aria-describedby": g,
                 "aria-labelledby": D,
                 "aria-invalid": S || undefined
             });
-            var Me = l()(fe, [ "inputRef", "onBlur", "onChange", "onFocus", "onKeyDown", "onSelect", "onInputClick" ].concat(L(a()(qe))));
+            var _e = l()(pe, [ "inputRef", "onBlur", "onChange", "onFocus", "onKeyDown", "onSelect", "onInputClick" ].concat(K(a()(Me))));
             var De = {
                 $append: o || undefined,
                 $error: S,
-                $prepend: Z || undefined
+                $prepend: ee || undefined
             };
-            var _e = U(U({}, qe), {}, {
+            var Re = J(J({}, Me), {}, {
                 "data-test": "textbox",
                 autoCapitalize: i,
                 autoComplete: u,
                 autoCorrect: s,
                 autoFocus: p,
-                className: N,
+                className: q,
                 disabled: h,
-                id: q,
-                maxLength: _,
-                name: V,
+                id: M,
+                maxLength: R,
+                name: $,
                 onBlur: Pe,
-                onChange: Te,
-                onFocus: ke,
-                onKeyDown: Ee,
-                onSelect: je,
-                onClick: Ie,
-                placeholder: Q,
+                onChange: Be,
+                onFocus: Te,
+                onKeyDown: je,
+                onSelect: Ie,
+                onClick: ke,
+                placeholder: X,
                 // support HTML attribute
-                ref: Ae,
-                required: ee,
+                ref: Ee,
+                required: re,
                 spellCheck: le,
                 style: {
                     height: xe
                 },
-                tabIndex: se,
+                tabIndex: de,
                 value: Oe,
                 $error: S
             });
             
-            return r().createElement(r().Fragment, null,  r().createElement(A, $({
+            return r().createElement(r().Fragment, null,  r().createElement(O, z({
                 tabIndex: -1,
                 "data-test": "text-area",
                 "data-test-value": Oe,
                 "data-test-disabled": h ? "disabled" : undefined,
-                elementRef: w,
-                flex: true,
-                inline: B,
+                elementRef: x,
+                $inline: N,
                 disabled: h
-            }, Me, De), ue &&  r().createElement(k, {
+            }, _e, De), ce &&  r().createElement(T, {
                 $disabled: !!h
-            }, ue),  r().createElement(E, null,  r().createElement(I, {
+            }, ce),  r().createElement(E, null,  r().createElement(I, {
                 "aria-hidden": "true",
                 tabIndex: -1,
-                onChange: ie,
+                onChange: ue,
                 rows: te,
-                ref: Se,
-                value: Q && !Oe ? Q : Oe
-            }),  r().createElement(j, _e)), v, O &&  r().createElement(k, {
+                ref: Ae,
+                value: X && !Oe ? X : Oe
+            }),  r().createElement(j, Re)), v, A &&  r().createElement(P, {
                 $disabled: !!h
-            }, O)),  r().createElement(b(), {
-                target: R,
+            }, A)),  r().createElement(m(), {
+                target: F,
                 eventType: "resize",
-                listener: Ne
+                listener: qe
             }));
         }
-        le.propTypes = ae;
-        le.componentType = "TextArea";
-        /* harmony default export */        const ue = le;
+        ce.propTypes = le;
+        ce.componentType = "TextArea";
+        /* harmony default export */        const se = ce;
         // only for styled components using TextArea
         }) // CONCATENATED MODULE: ./src/TextArea/index.ts
     ();
-    module.exports = n;
+    module.exports = t;
     /******/})();