@splunk/react-ui 4.43.0 → 5.0.0-beta.2

package/Text.js

@@ -8,27 +8,27 @@
     /******/ /* webpack/runtime/compat get default export */
     /******/    (() => {
         /******/ // getDefaultExport function for compatibility with non-harmony modules
-        /******/ e.n = t => {
-            /******/ var r = t && t.__esModule ? 
-            /******/ () => t["default"]
-            /******/ : () => t
+        /******/ e.n = r => {
+            /******/ var t = r && r.__esModule ? 
+            /******/ () => r["default"]
+            /******/ : () => r
             /******/;
-            e.d(r, {
-                a: r
+            e.d(t, {
+                a: t
             });
-            /******/            return r;
+            /******/            return t;
             /******/        };
         /******/    })();
     /******/
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ e.d = (t, r) => {
-            /******/ for (var n in r) {
-                /******/ if (e.o(r, n) && !e.o(t, n)) {
-                    /******/ Object.defineProperty(t, n, {
+        /******/ e.d = (r, t) => {
+            /******/ for (var n in t) {
+                /******/ if (e.o(t, n) && !e.o(r, n)) {
+                    /******/ Object.defineProperty(r, n, {
                         enumerable: true,
-                        get: r[n]
+                        get: t[n]
                     });
                     /******/                }
                 /******/            }
@@ -37,7 +37,7 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ e.o = (e, t) => Object.prototype.hasOwnProperty.call(e, t)
+        /******/ e.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
         /******/;
     })();
     /******/
@@ -56,357 +56,131 @@
             /******/        };
         /******/    })();
     /******/
-    /************************************************************************/    var t = {};
+    /************************************************************************/    var r = {};
     // ESM COMPAT FLAG
-        e.r(t);
+        e.r(r);
     // EXPORTS
-        e.d(t, {
-        default: () => /* reexport */ Be
+        e.d(r, {
+        default: () => /* reexport */ ue
     });
     // CONCATENATED MODULE: external "react"
-    const r = require("react");
-    var n =  e.n(r);
+    const t = require("react");
+    var n =  e.n(t);
     // CONCATENATED MODULE: external "prop-types"
-    const i = require("prop-types");
-    var a =  e.n(i);
-    // CONCATENATED MODULE: external "lodash/has"
-    const o = require("lodash/has");
-    var l =  e.n(o);
+    const o = require("prop-types");
+    var a =  e.n(o);
     // CONCATENATED MODULE: external "lodash/keys"
-    const s = require("lodash/keys");
-    var c =  e.n(s);
+    const i = require("lodash/keys");
+    var l =  e.n(i);
     // CONCATENATED MODULE: external "lodash/omit"
-    const p = require("lodash/omit");
-    var d =  e.n(p);
+    const u = require("lodash/omit");
+    var s =  e.n(u);
     // CONCATENATED MODULE: external "lodash/pickBy"
-    const u = require("lodash/pickBy");
-    var m =  e.n(u);
-    // CONCATENATED MODULE: external "@splunk/react-ui/ControlGroup"
-    const f = require("@splunk/react-ui/ControlGroup");
+    const c = require("lodash/pickBy");
+    var d =  e.n(c);
+    // CONCATENATED MODULE: external "@splunk/react-ui/Button"
+    const v = require("@splunk/react-ui/Button");
+    var b =  e.n(v);
     // CONCATENATED MODULE: external "@splunk/react-icons/Cross"
-    const v = require("@splunk/react-icons/Cross");
-    var h =  e.n(v);
-    // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/Close"
-    const b = require("@splunk/react-icons/enterprise/Close");
-    var y =  e.n(b);
-    // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/Search"
-    const g = require("@splunk/react-icons/enterprise/Search");
-    var x =  e.n(g);
-    // CONCATENATED MODULE: external "@splunk/react-icons/Magnifier"
-    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);
-    // CONCATENATED MODULE: external "@splunk/react-ui/TextArea"
-    const A = require("@splunk/react-ui/TextArea");
-    var E =  e.n(A);
-    // CONCATENATED MODULE: external "@splunk/themes"
-    const O = require("@splunk/themes");
-    // CONCATENATED MODULE: external "@splunk/ui-utils/style"
-    const T = require("@splunk/ui-utils/style");
+    const p = require("@splunk/react-icons/Cross");
+    var f =  e.n(p);
+    // CONCATENATED MODULE: external "@splunk/react-ui/ControlGroup"
+    const m = require("@splunk/react-ui/ControlGroup");
+    // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
+    const y = require("@splunk/react-ui/useControlled");
+    var g =  e.n(y);
     // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
-    const I = require("@splunk/ui-utils/i18n");
+    const h = require("@splunk/ui-utils/i18n");
     // CONCATENATED MODULE: external "@splunk/react-icons/EyeSlashed"
-    const $ = require("@splunk/react-icons/EyeSlashed");
-    var j =  e.n($);
+    const C = require("@splunk/react-icons/EyeSlashed");
+    var x =  e.n(C);
+    // CONCATENATED MODULE: external "@splunk/themes"
+    const k = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Text/IconOutlinedHide.tsx
-    function P() {
-        var e = (0, O.useSplunkTheme)(), t = e.family, r = e.density;
-        var i = r === "compact" ? "20" : "24";
+    function w() {
+        var e = (0, k.useSplunkTheme)(), r = e.family, t = e.density;
+        var o = t === "compact" ? "20" : "24";
         var a = "1.2em";
-        var o = t === "prisma" ? i : a;
+        var i = r === "prisma" ? o : a;
         
-        return n().createElement(j(), {
-            width: o,
-            height: o
+        return n().createElement(x(), {
+            width: i,
+            height: i
         });
     }
-    /* harmony default export */    const _ = P;
+    /* harmony default export */    const S = w;
     // CONCATENATED MODULE: external "@splunk/react-icons/Eye"
-    const D = require("@splunk/react-icons/Eye");
-    var B =  e.n(D);
+    const O = require("@splunk/react-icons/Eye");
+    var j =  e.n(O);
     // CONCATENATED MODULE: ./src/Text/IconOutlinedView.tsx
-    function N() {
-        var e = (0, O.useSplunkTheme)(), t = e.family, r = e.density;
-        var i = r === "compact" ? "20" : "24";
+    function E() {
+        var e = (0, k.useSplunkTheme)(), r = e.family, t = e.density;
+        var o = t === "compact" ? "20" : "24";
         var a = "1.2em";
-        var o = t === "prisma" ? i : a;
+        var i = r === "prisma" ? o : a;
         
-        return n().createElement(B(), {
-            width: o,
-            height: o
+        return n().createElement(j(), {
+            width: i,
+            height: i
         });
     }
-    /* harmony default export */    const q = N;
+    /* harmony default export */    const T = E;
     // CONCATENATED MODULE: external "styled-components"
-    const M = require("styled-components");
-    var R =  e.n(M);
+    const A = require("styled-components");
+    var B =  e.n(A);
+    // CONCATENATED MODULE: external "@splunk/react-ui/ButtonSimple"
+    const I = require("@splunk/react-ui/ButtonSimple");
     // CONCATENATED MODULE: external "@splunk/react-ui/Box"
-    const W = require("@splunk/react-ui/Box");
-    var V =  e.n(W);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Button"
-    const z = require("@splunk/react-ui/Button");
-    var F =  e.n(z);
+    const P = require("@splunk/react-ui/Box");
+    var q =  e.n(P);
     // CONCATENATED MODULE: ./src/Text/TextStyles.ts
-    var H = (0, M.css)([ "&,&[type]{cursor:not-allowed;color:", ";&::placeholder{color:", ";}}" ], (0, 
-    O.pick)({
-        enterprise: O.variables.textDisabledColor,
-        prisma: O.variables.contentColorDisabled
-    }), (0, O.pick)({
-        enterprise: O.variables.textDisabledColor,
-        prisma: O.variables.contentColorDisabled
-    }));
-    var K = (0, M.css)([ "border-color:", ";box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);", "" ], O.variables.interactiveColorBorderDisabled, (0, 
-    O.pick)({
-        enterprise: (0, M.css)([ "background-color:", ";" ], O.variables.interactiveColorBackgroundDisabled)
-    }));
-    var L = (0, M.css)([ "border-radius:", ";cursor:pointer;font-size:0.83333em;flex-grow:0;", ";&:not([disabled]){color:", ";}" ], (0, 
-    O.pick)({
-        enterprise: O.variables.borderRadius,
-        prisma: "50%"
-    }), (0, O.pick)({
-        enterprise: (0, M.css)([ "width:", ";height:", ";" ], O.variables.inputHeight, O.variables.inputHeight),
-        prisma: {
-            comfortable: (0, M.css)([ "width:26px;min-width:26px;min-height:26px;margin:8px;padding:0;" ]),
-            compact: (0, M.css)([ "width:22px;min-width:22px;min-height:22px;margin:8px;padding:0;" ])
-        }
-    }), (0, O.pick)({
-        enterprise: {
-            light: O.variables.gray60,
-            dark: O.variables.white
-        },
-        prisma: O.variables.contentColorMuted
-    }));
-    var G = R()(F()).withConfig({
+    var D = "230px";
+    var $ = B()(b()).withConfig({
         displayName: "TextStyles__StyledClearButton",
         componentId: "eg7n6t-0"
-    })([ "display:none;visibility:hidden;", "" ], L);
-    var U = R().span.withConfig({
-        displayName: "TextStyles__StyledSearchIconWrapper",
-        componentId: "eg7n6t-1"
-    })([ "", ";color:", ";pointer-events:none;padding:", ";", "" ], O.mixins.reset("inline-block"), (0, 
-    O.pick)({
-        enterprise: {
-            light: O.variables.gray60,
-            dark: O.variables.white
-        },
-        prisma: O.variables.contentColorMuted
-    }), (0, O.pick)({
-        comfortable: "0 8px",
-        compact: "0 6px"
-    }), (function(e) {
-        var t = e.$disabled;
-        return t && (0, M.css)([ "", "" ], (0, O.pick)({
-            enterprise: (0, M.css)([ "color:", ";" ], O.variables.textDisabledColor),
-            prisma: (0, M.css)([ "color:", ";" ], O.variables.contentColorDisabled)
-        }));
-    }));
-    var J = R()(V()).withConfig({
+    })([ "display:none;visibility:hidden;" ]);
+    var _ = B()(q()).withConfig({
         displayName: "TextStyles__StyledBox",
-        componentId: "eg7n6t-2"
-    })([ "display:flex;justify-content:space-between;flex-grow:1;flex-shrink:1;position:relative;&[data-inline]{width:230px;flex-basis:230px;[data-inline] + &{margin-left:", ";}}&:focus-within:not([disabled]){", "{", "}", "{visibility:visible;display:block;}}", "" ], O.variables.spacingSmall, /* sc-sel */ U, (0, 
-    O.pick)({
-        enterprise: (0, M.css)([ "display:none;" ])
-    }), /* sc-sel */ G, (function(e) {
-        var t = e.$isTimeInput;
-        return t && (0, M.css)([ "@media screen and (min--moz-device-pixel-ratio:0){", "{display:none;}}" ], /* sc-sel */ G);
-    }));
-    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, (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
-        },
-        prisma: O.variables.transparent
-    }), (0, O.pick)({
-        enterprise: "0 10px",
-        prisma: "0 12px"
-    }), (function(e) {
-        var t = e.$hasEndAdornment;
-        return t && (0, M.css)([ "padding-right:0;" ]);
-    }), (function(e) {
-        var t = e.$hasStartAdornment;
-        return t && (0, M.css)([ "padding-left:0;" ]);
-    }), (function(e) {
-        var t = e.$isDisabled;
-        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:", ";}" ], (0, O.pick)({
-            enterprise: {
-                light: O.variables.interactiveColorBorderHover,
-                dark: O.variables.borderColorWeak
-            },
-            prisma: O.variables.interactiveColorBorderHover
-        }));
+        componentId: "eg7n6t-1"
+    })([ "display:flex;justify-content:space-between;flex-grow:1;flex-shrink:1;gap:", ";padding-inline:", ";min-height:", ";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;cursor:text;&:hover:not([disabled]){border-color:", ";background-color:", "}&:not([disabled]):has(> input:focus){box-shadow:", ";}&:not([disabled]){", "{visibility:visible;display:block;}}", " ", " ", " ", " &[data-inline]{width:", ";flex-basis:", ";}", "" ], k.variables.spacingXSmall, k.variables.spacingSmall, k.variables.inputHeight, k.variables.interactiveColorBorder, k.variables.borderRadius, k.variables.interactiveColorBackground, k.variables.interactiveColorBorderHover, k.variables.interactiveColorOverlayHover, k.variables.focusShadow, /* sc-sel */ $, (function(e) {
+        var r = e.$error;
+        return r && (0, A.css)([ "border-color:", ";&:hover:not([disabled]){border-color:", ";}" ], k.variables.interactiveColorAccentError, k.variables.interactiveColorAccentErrorStrong);
     }), (function(e) {
-        var t = e.$error;
-        return t && (0, M.css)([ "&,&:hover{border-color:", ";}" ], O.variables.accentColorNegative);
+        var r = e.$append;
+        return r && (0, A.css)([ "margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0;border-right:none;" ]);
     }), (function(e) {
-        var t = e.$append;
-        return t && (0, M.css)([ "margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0;border-right:none;" ]);
+        var r = e.$prepend;
+        return r && (0, A.css)([ "border-top-left-radius:0;border-bottom-left-radius:0;" ]);
     }), (function(e) {
-        var t = e.$prepend;
-        return t && (0, M.css)([ "border-top-left-radius:0;border-bottom-left-radius:0;" ]);
+        var r = e.$disabled;
+        return r && (0, A.css)([ "border-color:", ";box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);background-color:", ";" ], k.variables.interactiveColorBorderDisabled, k.variables.interactiveColorBackgroundDisabled);
+    }), D, D, (function(e) {
+        var r = e.$isTimeInput;
+        return r && (0, A.css)([ "@media screen and (min--moz-device-pixel-ratio:0){", "{display:none;}}" ], /* sc-sel */ $);
     }));
-    /* Some of these need greater specificity than input[type=text] */    var X = R().input.withConfig({
+    /* Some of these need greater specificity than input[type=text] */    var N = B().input.withConfig({
         displayName: "TextStyles__StyledInput",
-        componentId: "eg7n6t-4"
-    })([ "", ";&,&[type]{outline-style:none;border:0;background:transparent;color:", ";flex-grow:1;font-family:", ";font-size:inherit;line-height:inherit;&[type='time']{&::-webkit-calendar-picker-indicator{display:none;}height:", ";@media screen and (min--moz-device-pixel-ratio:0){padding-right:", ";}}position:relative;&::placeholder{color:", ";opacity:1;}", " &[disabled],&[aria-disabled='true']{", "}}" ], O.mixins.reset("inline-flex"), (0, 
-    O.pick)({
-        enterprise: O.variables.textColor,
-        prisma: O.variables.contentColorActive
-    }), O.variables.sansFontFamily, (0, O.pick)({
-        enterprise: "20px",
-        prisma: {
-            comfortable: "24px",
-            compact: "20px"
-        }
-    }), (0, O.pick)({
-        enterprise: O.variables.spacingSmall,
-        prisma: "14px"
-    }), O.variables.contentColorMuted, (function(e) {
-        var t = e.$error;
-        return t && (0, M.css)([ "&,&:hover{color:", ";}" ], (0, O.pick)({
-            enterprise: {
-                light: O.variables.errorColorD10,
-                dark: O.variables.errorColorL20
-            },
-            prisma: O.variables.contentColorActive
-        }));
-    }), H);
-    var Y = R()(F()).withConfig({
-        displayName: "TextStyles__StyledVisibilityToggle",
-        componentId: "eg7n6t-5"
-    })([ "", "" ], L);
-    var Z = R().span.withConfig({
-        displayName: "TextStyles__StyledPlaceholder",
-        componentId: "eg7n6t-6"
-    })([ "pointer-events:none;color:", ";position:absolute;overflow:hidden;font-size:inherit;line-height:inherit;height:", ";margin-right:", ";", ";", ";", "" ], (0, 
-    O.pick)({
-        enterprise: O.variables.textGray,
-        prisma: O.variables.contentColorMuted
-    }), O.variables.lineHeight, (0, O.pick)({
-        enterprise: "10px",
-        prisma: "14px"
-    }), (function(e) {
-        var t = e.$hasStartAdornment, r = e.$startAdornmentWidth;
-        return t && (r ? (0, M.css)([ "margin-left:", "px;" ], r) : (0, M.css)([ "margin-left:", ";" ], (0, 
-        O.pick)({
-            enterprise: {
-                comfortable: "30px",
-                compact: "26px"
-            },
-            prisma: {
-                comfortable: "38px",
-                compact: "30px"
-            }
-        })));
-    }), (function(e) {
-        var t = e.$hasEndAdornment, r = e.$endAdornmentWidth;
-        return t && (r ? (0, M.css)([ "max-width:calc( 100% - ", " - ", "px );" ], (0, O.pick)({
-            enterprise: "10px",
-            prisma: "14px"
-        }), r) : (0, M.css)([ "max-width:calc( 100% - ", " - ", " );" ], (0, O.pick)({
-            enterprise: "10px",
-            prisma: "14px"
-        }), (0, O.pick)({
-            enterprise: {
-                comfortable: "30px",
-                compact: "26px"
-            },
-            prisma: {
-                comfortable: "38px",
-                compact: "30px"
-            }
-        })));
-    }), (function(e) {
-        var t = e.$hasBothAdornment, r = e.$endAdornmentWidth, n = e.$startAdornmentWidth;
-        return t && (0, M.css)([ "max-width:calc(100% - ", "px - ", "px);" ], n, r);
-    }));
-    var ee = (0, M.css)([ "display:inline-flex;align-items:center;justify-content:center;height:", ";pointer-events:none;" ], (0, 
-    O.pick)({
-        enterprise: {
-            comfortable: "30px",
-            compact: "26px"
-        },
-        prisma: {
-            comfortable: "38px",
-            compact: "30px"
-        }
-    }));
-    var te = R().div.withConfig({
-        displayName: "TextStyles__StyledStartAdornmentHolder",
-        componentId: "eg7n6t-7"
-    })([ "", " ", ";" ], ee, (function(e) {
-        var t = e.$width;
-        return t ? (0, M.css)([ "min-width:", "px;" ], t) : (0, M.css)([ "min-width:", ";" ], (0, 
-        O.pick)({
-            enterprise: {
-                comfortable: "30px",
-                compact: "26px"
-            },
-            prisma: {
-                comfortable: "38px",
-                compact: "30px"
-            }
-        }));
-    }));
-    var re = R().div.withConfig({
-        displayName: "TextStyles__StyledEndAdornmentHolder",
-        componentId: "eg7n6t-8"
-    })([ "", " ", ";" ], ee, (function(e) {
-        var t = e.$width;
-        return t ? (0, M.css)([ "min-width:", "px;" ], t) : (0, M.css)([ "min-width:", ";" ], (0, 
-        O.pick)({
-            enterprise: {
-                comfortable: "30px",
-                compact: "26px"
-            },
-            prisma: {
-                comfortable: "38px",
-                compact: "30px"
-            }
-        }));
-    }));
-    var ne = R().div.withConfig({
+        componentId: "eg7n6t-2"
+    })([ "", ";", " width:100%;outline-style:none;border:0;background:transparent;flex-grow:1;font-size:inherit;&[type='time']{&::-webkit-calendar-picker-indicator{display:none;}}&::placeholder{color:", ";opacity:1;}&[disabled],&[aria-disabled='true']{cursor:not-allowed;color:", ";&::placeholder{color:", ";}}" ], k.mixins.reset("inline-flex"), k.mixins.typography("body", {
+        lineHeight: "single",
+        color: "active"
+    }), k.variables.contentColorMuted, k.variables.contentColorDisabled, k.variables.contentColorDisabled);
+    var R = B().div.withConfig({
         displayName: "TextStyles__StyledAdornment",
-        componentId: "eg7n6t-9"
-    })([ "display:inline-flex;align-items:center;justify-content:center;position:absolute;pointer-events:none;z-index:1;height:", ";color:", ";", ";", ";", "" ], (0, 
-    O.pick)({
-        enterprise: {
-            comfortable: "30px",
-            compact: "26px"
-        },
-        prisma: {
-            comfortable: "38px",
-            compact: "30px"
-        }
-    }), (0, O.pick)({
-        enterprise: {
-            light: O.variables.gray60,
-            dark: O.variables.white
-        },
-        prisma: O.variables.contentColorMuted
-    }), (function(e) {
-        var t = e.$position;
-        return t === "start" ? (0, M.css)([ "top:1px;left:1px;" ]) : (0, M.css)([ "top:1px;right:1px;" ]);
+        componentId: "eg7n6t-3"
+    })([ "display:inline-flex;align-items:center;justify-content:center;pointer-events:none;z-index:1;color:", ";", " ", ";& > button{", "}& > button:focus,& > a:focus{box-shadow:", ";}" ], k.variables.contentColorMuted, (function() {
+        return (0, A.css)([ "height:calc(", " - 2px);" ], k.variables.inputHeight);
     }), (function(e) {
-        var t = e.disabled;
-        return t && H;
-    }), (0, O.pick)({
-        enterprise: (0, M.css)([ "margin-left:-1px;margin-right:-1px;" ])
-    }));
+        var r = e.$disabled;
+        return r && (0, A.css)([ "cursor:not-allowed;color:", ";" ], k.variables.contentColorDisabled);
+    }), (0, I.buttonMixin)({
+        borderColor: k.variables.transparent,
+        borderColorHover: k.variables.transparent,
+        borderColorActive: k.variables.transparent,
+        borderColorDisabled: k.variables.transparent,
+        backgroundHover: k.variables.interactiveColorOverlayHover,
+        backgroundActive: k.variables.interactiveColorOverlayActive
+    }), k.variables.focusShadowInset);
     // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
     /**
  * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
@@ -414,198 +188,163 @@
  * @param ref - The React callback or object ref. Can be `null` or `undefined`.
  * @param current - The new value of the ref.
  */
-    function ie(e, t) {
+    function F(e, r) {
         if (e) {
             if (typeof e === "function") {
-                e(t);
+                e(r);
             } else {
                 // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
                 // the intention here is to signal "we will take care of setting 'current', not you".
-                e.current = t;
+                e.current = r;
  // eslint-disable-line no-param-reassign
                         }
         }
     }
     // CONCATENATED MODULE: ./src/Text/Text.tsx
-    function ae(e) {
+    function H(e) {
         "@babel/helpers - typeof";
-        return ae = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
+        return H = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
             return typeof e;
         } : function(e) {
             return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-        }, ae(e);
+        }, H(e);
     }
-    function oe(e) {
-        return pe(e) || ce(e) || se(e) || le();
+    function M(e) {
+        return K(e) || V(e) || Z(e) || z();
     }
-    function le() {
+    function z() {
         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 se(e, t) {
-        if (e) {
-            if ("string" == typeof e) return de(e, t);
-            var r = {}.toString.call(e).slice(8, -1);
-            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? de(e, t) : void 0;
-        }
-    }
-    function ce(e) {
+    function V(e) {
         if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
     }
-    function pe(e) {
-        if (Array.isArray(e)) return de(e);
+    function K(e) {
+        if (Array.isArray(e)) return ee(e);
     }
-    function de(e, t) {
-        (null == t || t > e.length) && (t = e.length);
-        for (var r = 0, n = Array(t); r < t; r++) {
-            n[r] = e[r];
-        }
-        return n;
-    }
-    function ue(e, t) {
-        var r = Object.keys(e);
+    function L(e, r) {
+        var t = Object.keys(e);
         if (Object.getOwnPropertySymbols) {
             var n = Object.getOwnPropertySymbols(e);
-            t && (n = n.filter((function(t) {
-                return Object.getOwnPropertyDescriptor(e, t).enumerable;
-            }))), r.push.apply(r, n);
+            r && (n = n.filter((function(r) {
+                return Object.getOwnPropertyDescriptor(e, r).enumerable;
+            }))), t.push.apply(t, n);
         }
-        return r;
+        return t;
     }
-    function me(e) {
-        for (var t = 1; t < arguments.length; t++) {
-            var r = null != arguments[t] ? arguments[t] : {};
-            t % 2 ? ue(Object(r), !0).forEach((function(t) {
-                Oe(e, t, r[t]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : ue(Object(r)).forEach((function(t) {
-                Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(r, t));
+    function G(e) {
+        for (var r = 1; r < arguments.length; r++) {
+            var t = null != arguments[r] ? arguments[r] : {};
+            r % 2 ? L(Object(t), !0).forEach((function(r) {
+                U(e, r, t[r]);
+            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : L(Object(t)).forEach((function(r) {
+                Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
             }));
         }
         return e;
     }
-    function fe(e, t) {
-        if (null == e) return {};
-        var r, n, i = ve(e, t);
-        if (Object.getOwnPropertySymbols) {
-            var a = Object.getOwnPropertySymbols(e);
-            for (n = 0; n < a.length; n++) {
-                r = a[n], t.includes(r) || {}.propertyIsEnumerable.call(e, r) && (i[r] = e[r]);
-            }
-        }
-        return i;
+    function U(e, r, t) {
+        return (r = X(r)) in e ? Object.defineProperty(e, r, {
+            value: t,
+            enumerable: !0,
+            configurable: !0,
+            writable: !0
+        }) : e[r] = t, e;
     }
-    function ve(e, t) {
-        if (null == e) return {};
-        var r = {};
-        for (var n in e) {
-            if ({}.hasOwnProperty.call(e, n)) {
-                if (t.includes(n)) continue;
-                r[n] = e[n];
-            }
+    function X(e) {
+        var r = J(e, "string");
+        return "symbol" == H(r) ? r : r + "";
+    }
+    function J(e, r) {
+        if ("object" != H(e) || !e) return e;
+        var t = e[Symbol.toPrimitive];
+        if (void 0 !== t) {
+            var n = t.call(e, r || "default");
+            if ("object" != H(n)) return n;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
         }
-        return r;
+        return ("string" === r ? String : Number)(e);
     }
-    function he() {
-        return he = Object.assign ? Object.assign.bind() : function(e) {
-            for (var t = 1; t < arguments.length; t++) {
-                var r = arguments[t];
-                for (var n in r) {
-                    ({}).hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    function Q() {
+        return Q = 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]);
                 }
             }
             return e;
-        }, he.apply(null, arguments);
+        }, Q.apply(null, arguments);
     }
-    function be(e, t) {
-        if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function");
+    function W(e, r) {
+        return te(e) || re(e, r) || Z(e, r) || Y();
     }
-    function ye(e, t) {
-        for (var r = 0; r < t.length; r++) {
-            var n = t[r];
-            n.enumerable = n.enumerable || !1, n.configurable = !0, "value" in n && (n.writable = !0), 
-            Object.defineProperty(e, Te(n.key), n);
+    function Y() {
+        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) {
+        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;
         }
     }
-    function ge(e, t, r) {
-        return t && ye(e.prototype, t), r && ye(e, r), Object.defineProperty(e, "prototype", {
-            writable: !1
-        }), e;
+    function ee(e, r) {
+        (null == r || r > e.length) && (r = e.length);
+        for (var t = 0, n = Array(r); t < r; t++) {
+            n[t] = e[t];
+        }
+        return n;
     }
-    function xe(e, t) {
-        if ("function" != typeof t && null !== t) throw new TypeError("Super expression must either be null or a function");
-        e.prototype = Object.create(t && t.prototype, {
-            constructor: {
-                value: e,
-                writable: !0,
-                configurable: !0
+    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, s = !1;
+            try {
+                if (a = (t = t.call(e)).next, 0 === r) {
+                    if (Object(t) !== t) return;
+                    u = !1;
+                } else for (;!(u = (n = a.call(t)).done) && (l.push(n.value), l.length !== r); u = !0) {
+                }
+            } catch (e) {
+                s = !0, o = e;
+            } finally {
+                try {
+                    if (!u && null != t["return"] && (i = t["return"](), Object(i) !== i)) return;
+                } finally {
+                    if (s) throw o;
+                }
             }
-        }), Object.defineProperty(e, "prototype", {
-            writable: !1
-        }), t && Ce(e, t);
-    }
-    function Ce(e, t) {
-        return Ce = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(e, t) {
-            return e.__proto__ = t, e;
-        }, Ce(e, t);
-    }
-    function we(e) {
-        var t = Ae();
-        return function() {
-            var r, n = Ee(e);
-            if (t) {
-                var i = Ee(this).constructor;
-                r = Reflect.construct(n, arguments, i);
-            } else r = n.apply(this, arguments);
-            return ke(this, r);
-        };
-    }
-    function ke(e, t) {
-        if (t && ("object" == ae(t) || "function" == typeof t)) return t;
-        if (void 0 !== t) throw new TypeError("Derived constructors may only return object or undefined");
-        return Se(e);
-    }
-    function Se(e) {
-        if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-        return e;
-    }
-    function Ae() {
-        try {
-            var e = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], (function() {})));
-        } catch (e) {}
-        return (Ae = function t() {
-            return !!e;
-        })();
-    }
-    function Ee(e) {
-        return Ee = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(e) {
-            return e.__proto__ || Object.getPrototypeOf(e);
-        }, Ee(e);
+            return l;
+        }
     }
-    function Oe(e, t, r) {
-        return (t = Te(t)) in e ? Object.defineProperty(e, t, {
-            value: r,
-            enumerable: !0,
-            configurable: !0,
-            writable: !0
-        }) : e[t] = r, e;
+    function te(e) {
+        if (Array.isArray(e)) return e;
     }
-    function Te(e) {
-        var t = Ie(e, "string");
-        return "symbol" == ae(t) ? t : t + "";
+    function ne(e, r) {
+        if (null == e) return {};
+        var t, n, o = oe(e, r);
+        if (Object.getOwnPropertySymbols) {
+            var a = Object.getOwnPropertySymbols(e);
+            for (n = 0; n < a.length; n++) {
+                t = a[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (o[t] = e[t]);
+            }
+        }
+        return o;
     }
-    function Ie(e, t) {
-        if ("object" != ae(e) || !e) return e;
-        var r = e[Symbol.toPrimitive];
-        if (void 0 !== r) {
-            var n = r.call(e, t || "default");
-            if ("object" != ae(n)) return n;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
+    function oe(e, r) {
+        if (null == e) return {};
+        var t = {};
+        for (var n in e) {
+            if ({}.hasOwnProperty.call(e, n)) {
+                if (r.includes(n)) continue;
+                t[n] = e[n];
+            }
         }
-        return ("string" === t ? String : Number)(e);
+        return t;
     }
     /** @public */
     /** @public */
-    /** @public */    var $e = {
-        appearance: a().oneOf([ "default", "search" ]),
+    /** @public */    var ae = {
         append: a().bool,
         autoCapitalize: a().string,
         autoComplete: a().string,
@@ -613,8 +352,6 @@
         autoFocus: a().bool,
         canClear: a().bool,
         children: a().node,
-        /** @private. */
-        classNamePrivate: a().string,
         defaultValue: a().string,
         describedBy: a().string,
         disabled: a().oneOfType([ a().bool, a().oneOf([ "dimmed" ]) ]),
@@ -628,20 +365,16 @@
         inputRef: a().oneOfType([ a().func, a().object ]),
         labelledBy: a().string,
         maxLength: a().number,
-        multiline: a().bool,
         name: a().string,
         onBlur: a().func,
         onChange: a().func,
         onFocus: a().func,
         onKeyDown: a().func,
         onSelect: a().func,
-        onInputClick: a().func,
-        placeholder: a().string,
+        onClick: a().func,
         prepend: a().bool,
         /** @private. */
         required: a().bool,
-        rowsMax: a().number,
-        rowsMin: a().number,
         spellCheck: a().bool,
         tabIndex: a().number,
         startAdornment: a().node,
@@ -649,445 +382,225 @@
         splunkTheme: a().object,
         type: a().string,
         passwordVisibilityToggle: a().bool,
-        useSyntheticPlaceholder: a().bool,
         value: a().string
     };
-    var je = {
-        appearance: "default",
-        append: false,
-        autoFocus: false,
-        canClear: false,
-        disabled: false,
-        error: false,
-        inline: false,
-        multiline: false,
-        placeholder: "",
-        prepend: false,
-        rowsMax: 8,
-        rowsMin: 2,
-        tabIndex: 0,
-        type: "text",
-        passwordVisibilityToggle: false
-    };
-    /** 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 = we(r);
-        ge(r, null, [ {
-            key: "validateRows",
-            // @docs-props-type TextPropsBase
-            value: function e(t) {
-                var r = t.rowsMin, n = t.rowsMax;
-                if (false) {}
-            }
-        } ]);
-        function r(e) {
-            var i;
-            be(this, r);
-            i = t.call(this, e);
-            Oe(Se(i), "controlledExternally", void 0);
-            Oe(Se(i), "input", null);
-            Oe(Se(i), "startAdornment", null);
-            Oe(Se(i), "endAdornment", null);
-            Oe(Se(i), "getAdornmentWidth", (function() {
-                var e = i.startAdornment ? i.startAdornment.getBoundingClientRect() : undefined;
-                var t = e && Math.round(e.width);
-                if (i.state.startAdornmentWidth !== t) {
-                    i.setState({
-                        startAdornmentWidth: t
-                    });
-                }
-                var r = i.endAdornment ? i.endAdornment.getBoundingClientRect() : undefined;
-                var n = r && Math.round(r.width);
-                if (i.state.endAdornmentWidth !== n) {
-                    i.setState({
-                        endAdornmentWidth: n
-                    });
-                }
-            }));
-            Oe(Se(i), "handleInputMount", (function(e) {
-                i.input = e;
-                ie(i.props.inputRef, e);
-            }));
-            Oe(Se(i), "handleInputChange", (function(e) {
-                var t, r;
-                var n = e.target.value;
-                var a = i.props.name;
-                if (!i.isControlled()) {
-                    i.setState({
-                        value: n
-                    });
-                }
-                (t = (r = i.props).onChange) === null || t === void 0 ? void 0 : t.call(r, e, {
-                    value: n,
-                    name: a
-                });
-            }));
-            Oe(Se(i), "handleInputKeyDown", (function(e) {
-                var t, r;
-                (t = (r = i.props).onKeyDown) === null || t === void 0 ? void 0 : t.call(r, e);
-            }));
-            Oe(Se(i), "handleInputSelect", (function(e) {
-                var t, r;
-                (t = (r = i.props).onSelect) === null || t === void 0 ? void 0 : t.call(r, e);
-            }));
-            Oe(Se(i), "handleInputClick", (function(e) {
-                var t, r;
-                (t = (r = i.props).onInputClick) === null || t === void 0 ? void 0 : t.call(r, e);
-            }));
-            Oe(Se(i), "handleBoxClick", (function(e) {
-                var t, r;
-                if (document.activeElement !== i.input) {
-                    var n;
-                    (n = i.input) === null || n === void 0 ? void 0 : n.focus();
-                }
-                (t = (r = i.props).onClick) === null || t === void 0 ? void 0 : t.call(r, e);
-            }));
-            Oe(Se(i), "handleAdornmentClick", (function(e) {
-                e.stopPropagation();
-            }));
-            Oe(Se(i), "handleInputFocus", (function(e) {
-                var t, r;
-                var n = e.target.value;
-                var a = i.props.name;
-                (t = (r = i.props).onFocus) === null || t === void 0 ? void 0 : t.call(r, e, {
-                    value: n,
-                    name: a
-                });
-            }));
-            Oe(Se(i), "handleInputBlur", (function(e) {
-                var t, r;
-                var n = e.target.value;
-                var a = i.props.name;
-                (t = (r = i.props).onBlur) === null || t === void 0 ? void 0 : t.call(r, e, {
-                    value: n,
-                    name: a
-                });
-            }));
-            Oe(Se(i), "handleClear", (function(e) {
-                var t, r;
-                e.preventDefault();
-                var n = "";
-                var a = i.props.name;
-                if (!i.isControlled()) {
-                    i.setState({
-                        value: n
-                    });
-                }
-                i.focus();
-                (t = (r = i.props).onChange) === null || t === void 0 ? void 0 : t.call(r, e, {
-                    value: n,
-                    name: a
-                });
-            }));
-            Oe(Se(i), "handleVisibilityToggle", (function() {
-                i.setState((function(e) {
-                    return {
-                        hideVisibility: !e.hideVisibility
-                    };
-                }));
-            }));
-            Oe(Se(i), "renderEndAdornment", (function() {
-                var e;
-                var t = i.props, r = t.appearance, a = t.endAdornment, o = t.passwordVisibilityToggle, l = t.disabled, s = t.canClear, c = t.splunkTheme;
-                var p = i.state.hideVisibility;
-                var d = c.isPrisma, u = c.isCompact, m = c.isEnterprise;
-                var f = u ? "20px" : "24px";
-                var v = {
-                    ref: function e(t) {
-                        i.endAdornment = t;
-                    },
-                    disabled: !!l,
-                    $position: "end"
-                };
-                if (a) {
-                    
-                    return n().createElement(ne, he({
-                        "data-test": "end-adornment",
-                        onClick: i.handleAdornmentClick
-                    }, v), a);
-                }
-                if (o && !l) {
-                    var b = p ?  n().createElement(q, null) :  n().createElement(_, null);
-                    var g = p ? (0, I._)("Show password") : (0, I._)("Hide password");
-                    
-                    return n().createElement(ne, he({
-                        onClick: i.handleAdornmentClick
-                    }, v),  n().createElement(Y, {
-                        appearance: "subtle",
-                        "data-test": "password-toggle",
-                        inline: false,
-                        onClick: i.handleVisibilityToggle,
-                        type: "button",
-                        icon: b,
-                        "aria-label": g
-                    }));
-                }
-                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) {
-                        
-                        return n().createElement(ne, v,  n().createElement(U, {
-                            $disabled: !!l,
-                            "data-test": "search-icon"
-                        },  n().createElement(x(), {
-                            screenReaderText: null,
-                            hideDefaultTooltip: true,
-                            size: "16px",
-                            inline: false
-                        })));
-                    }
-                    
-                    return n().createElement(ne, v, !l &&  n().createElement(G, {
-                        appearance: "subtle",
-                        "data-test": "clear",
-                        inline: false,
-                        "aria-label": k,
-                        icon:  n().createElement(y(), {
-                            size: 1,
-                            screenReaderText: null
-                        }),
-                        onClick: i.handleClear
-                    }),  n().createElement(U, {
-                        "data-test": "search-icon",
-                        $disabled: !!l
-                    },  n().createElement(x(), {
-                        screenReaderText: null,
-                        hideDefaultTooltip: true,
-                        size: "16px",
-                        inline: false
-                    })));
-                }
-                if (!!S && (d && r === "search" || s)) {
-                    
-                    return n().createElement(ne, v, !l &&  n().createElement(G, {
-                        "data-test": "clear",
-                        appearance: "subtle",
-                        "aria-label": k,
-                        onClick: i.handleClear,
-                        icon: m ?  n().createElement(y(), {
-                            inline: false,
-                            screenReaderText: null
-                        }) :  n().createElement(h(), {
-                            height: f,
-                            inline: false,
-                            width: f
-                        })
-                    }));
-                }
-                return undefined;
-            }));
-            Oe(Se(i), "renderStartAdornment", (function() {
-                var e = i.props, t = e.appearance, r = e.startAdornment, a = e.splunkTheme, o = e.disabled;
-                var l = a.isPrisma, s = a.isCompact;
-                var c = s ? "20px" : "24px";
-                var p = {
-                    ref: function e(t) {
-                        i.startAdornment = t;
-                    },
-                    disabled: !!o,
-                    $position: "start"
-                };
-                if (r) {
-                    
-                    return n().createElement(ne, he({
-                        "data-test": "start-adornment",
-                        onClick: i.handleAdornmentClick
-                    }, p), r);
-                }
-                if (l && t === "search") {
-                    
-                    return n().createElement(ne, p,  n().createElement(U, {
-                        "data-test": "search-icon",
-                        $disabled: !!o
-                    },  n().createElement(w(), {
-                        height: c,
-                        width: c
-                    })));
-                }
-                return undefined;
-            }));
-            Oe(Se(i), "getDisplayValue", (function() {
-                var e = i.isControlled() ? i.props.value : i.state.value;
-                return e;
-            }));
-            i.controlledExternally = l()(e, "value");
-            i.state = {
-                value: e.defaultValue || "",
-                hideVisibility: true
-            };
-            if (false) {}
-            if (false) {}
-            if (l()(e, "useSyntheticPlaceholder")) {
-                // eslint-disable-next-line no-console
-                console.warn("The 'Text' prop 'useSyntheticPlaceholder' has been marked for deprecation.");
-            }
-            if (false) {}
-            if (false) {}
-            if (false) {}
-            r.validateRows(e);
-            return i;
-        }
-        ge(r, [ {
-            key: "componentDidMount",
-            value: function e() {
-                this.getAdornmentWidth();
+    var ie =  n().createElement(f(), {
+        inline: false
+    });
+    /** Note: Text places role and aria props onto the input. All other props are placed on the wrapper. */    function le(e) {
+        var r;
+        var o = e.append, a = o === void 0 ? false : o, i = e.autoCapitalize, u = e.autoComplete, c = e.autoCorrect, v = e.autoFocus, p = v === void 0 ? false : v, f = e.canClear, y = f === void 0 ? false : f, C = e.children, x = e.defaultValue, k = e.disabled, w = k === void 0 ? false : k, O = e.describedBy, j = e.elementRef, E = e.endAdornment, A = e.error, B = A === void 0 ? false : A, I = e.inline, P = I === void 0 ? false : I, q = e.inputClassName, D = e.inputId, H = e.inputRef, z = e.labelledBy, V = e.maxLength, K = e.name, L = e.onBlur, U = e.onChange, X = e.onClick, J = e.onFocus, Y = e.onKeyDown, Z = e.onSelect, ee = e.passwordVisibilityToggle, re = ee === void 0 ? false : ee, te = e.placeholder, oe = e.prepend, ae = oe === void 0 ? false : oe, le = e.required, ue = e.spellCheck, se = e.startAdornment, ce = e.tabIndex, de = ce === void 0 ? 0 : ce, ve = e.title, be = e.type, pe = be === void 0 ? "text" : be, fe = e.value, me = ne(e, [ "append", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "canClear", "children", "defaultValue", "disabled", "describedBy", "elementRef", "endAdornment", "error", "inline", "inputClassName", "inputId", "inputRef", "labelledBy", "maxLength", "name", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "onSelect", "passwordVisibilityToggle", "placeholder", "prepend", "required", "spellCheck", "startAdornment", "tabIndex", "title", "type", "value" ]);
+        // @docs-props-type TextPropsBase
+                var ye = (0, t.useContext)(m.ControlGroupContext);
+        var ge = g()({
+            componentName: "Text",
+            /* eslint-disable-next-line prefer-rest-params */
+            componentProps: arguments[0]
+        });
+        var he = (0, t.useRef)(null);
+        var Ce = (0, t.useState)(x || ""), xe = W(Ce, 2), ke = xe[0], we = xe[1];
+        var Se = (0, t.useState)(true), Oe = W(Se, 2), je = Oe[0], Ee = Oe[1];
+        var Te = (0, t.useMemo)((function() {
+            return ge ? fe : ke;
+        }), [ ge, fe, ke ]);
+        var Ae = (0, t.useCallback)((function(e) {
+            var r = e.target.value;
+            L === null || L === void 0 ? void 0 : L(e, {
+                value: r,
+                name: K
+            });
+        }), [ K, L ]);
+        var Be = (0, t.useCallback)((function(e) {
+            var r = e.target.value;
+            if (!ge) {
+                we(r);
             }
-        }, {
-            key: "componentDidUpdate",
-            value: function e(t) {
-                if (false) {}
-                if (false) {}
-                r.validateRows(this.props);
-                this.getAdornmentWidth();
+            U === null || U === void 0 ? void 0 : U(e, {
+                value: r,
+                name: K
+            });
+        }), [ ge, K, U ]);
+        var Ie = (0, t.useCallback)((function(e) {
+            var r;
+            e.preventDefault();
+            var t = "";
+            if (!ge) {
+                we(t);
             }
-        }, {
-            key: "isControlled",
-            value: function e() {
-                return this.controlledExternally;
+            he === null || he === void 0 ? void 0 : (r = he.current) === null || r === void 0 ? void 0 : r.focus();
+            U === null || U === void 0 ? void 0 : U(e, {
+                value: t,
+                name: K
+            });
+        }), [ ge, K, U ]);
+        var Pe = (0, t.useCallback)((function(e) {
+            X === null || X === void 0 ? void 0 : X(e);
+            e.stopPropagation();
+        }), [ X ]);
+        var qe = (0, t.useCallback)((function(e) {
+            if (document.activeElement !== he.current) {
+                var r;
+                (r = he.current) === null || r === void 0 ? void 0 : r.focus();
             }
-        }, {
-            key: "blur",
-            // eslint-disable-next-line react/no-unused-class-component-methods
-            value: function e() {
-                var t;
-                (t = this.input) === null || t === void 0 ? void 0 : t.blur();
+            X === null || X === void 0 ? void 0 : X(e);
+        }), [ X ]);
+        var De = (0, t.useCallback)((function(e) {
+            e.stopPropagation();
+        }), []);
+        var $e = (0, t.useCallback)((function(e) {
+            var r = e.target.value;
+            J === null || J === void 0 ? void 0 : J(e, {
+                value: r,
+                name: K
+            });
+        }), [ K, J ]);
+        var _e = (0, t.useCallback)((function(e) {
+            Y === null || Y === void 0 ? void 0 : Y(e);
+        }), [ Y ]);
+        var Ne = (0, t.useCallback)((function(e) {
+            he.current = e;
+            F(H, e);
+        }), [ H, he ]);
+        var Re = (0, t.useCallback)((function(e) {
+            Z === null || Z === void 0 ? void 0 : Z(e);
+        }), [ Z ]);
+        var Fe = (0, t.useCallback)((function() {
+            Ee(!je);
+        }), [ je ]);
+        var He = (0, t.useCallback)((function() {
+            var e;
+            var r = {
+                $disabled: !!w,
+                $position: "end"
+            };
+            if (E) {
+                
+                return n().createElement(R, Q({
+                    "data-test": "end-adornment",
+                    onClick: De
+                }, r), E);
             }
-            /**
-     * Place focus on the input.
-     */        }, {
-            key: "focus",
-            value: function e(t) {
-                var r;
-                (r = this.input) === null || r === void 0 ? void 0 : r.focus(t);
+            if (re && !w) {
+                var t = je ?  n().createElement(T, null) :  n().createElement(S, null);
+                var o = je ? (0, h._)("Show password") : (0, h._)("Hide password");
+                
+                return n().createElement(R, r,  n().createElement(b(), {
+                    appearance: "secondary",
+                    "data-test": "password-toggle",
+                    inline: false,
+                    onClick: Fe,
+                    type: "button",
+                    icon: t,
+                    "aria-label": o
+                }));
             }
- // eslint-disable-next-line react/no-unused-class-component-methods
-                }, {
-            key: "select",
-            value: function e() {
-                var t;
-                (t = this.input) === null || t === void 0 ? void 0 : t.select();
+            var a = (e = ye.labelAttrs) === null || e === void 0 ? void 0 : e.text;
+            var i = a ? (0, h._)("Clear ".concat(a, " text field")) : (0, h._)("Clear text field");
+            if (!!Te && y) {
+                
+                return n().createElement(R, r, !w &&  n().createElement($, {
+                    "data-test": "clear",
+                    appearance: "secondary",
+                    "aria-label": i,
+                    onClick: Ie,
+                    icon: ie
+                }));
             }
-        }, {
-            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, 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": C,
-                    "aria-invalid": b || undefined,
-                    "aria-disabled": f === "dimmed"
-                });
-                var R = d()(q, [ "inputRef", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "onSelect", "onInputClick", "rowsMax", "rowsMin" ].concat(oe(c()(M))));
-                var W = this.getDisplayValue();
-                var V = {
-                    className: (0, T.toClassName)(p, g),
-                    $append: r || undefined,
-                    $error: b,
-                    $prepend: $ || undefined
-                };
-                var z = this.state.hideVisibility ? "password" : "text";
-                var F = O ? z : B;
-                var H = me(me({}, M), {}, {
-                    "data-test": "textbox",
-                    autoCapitalize: i,
-                    autoComplete: a,
-                    autoCorrect: o,
-                    autoFocus: l,
-                    id: x,
-                    maxLength: k,
-                    placeholder: I && !N ? I : undefined,
-                    name: A,
-                    onChange: this.handleInputChange,
-                    onKeyDown: this.handleInputKeyDown,
-                    onSelect: this.handleInputSelect,
-                    onClick: this.handleInputClick,
-                    onFocus: this.handleInputFocus,
-                    onBlur: this.handleInputBlur,
-                    ref: this.handleInputMount,
-                    required: j,
-                    spellCheck: P,
-                    style: {
-                        height: this.state.height
-                    },
-                    title: D,
-                    tabIndex: _,
-                    type: F,
-                    value: W,
-                    $error: b
-                });
-                var K = N && I && !W;
-                // Do not render value in DOM when type is password, or passwordVisibilityToggle is enabled
-                                var L = B === "password" || O ? undefined : W;
-                // Firefox hack (SUI-2716). Remove when fixed: https://bugzilla.mozilla.org/show_bug.cgi?id=1427173
-                                var G = B === "time";
-                var U = this.renderStartAdornment();
-                var Y = this.renderEndAdornment();
-                var ee = !!U;
-                var ne = !!Y;
-                if (w) {
-                    
-                    return n().createElement(E(), this.props);
-                }
+            return undefined;
+        }), [ y, (r = ye.labelAttrs) === null || r === void 0 ? void 0 : r.text, w, Te, E, De, Ie, Fe, je, re ]);
+        var Me = (0, t.useCallback)((function() {
+            var e = {
+                disabled: !!w,
+                $position: "start"
+            };
+            if (se) {
                 
-                return n().createElement(J, he({
-                    tabIndex: -1,
-                    $isTimeInput: G,
-                    className: (0, T.toClassName)(p, u),
-                    "data-test": "text",
-                    "data-test-value": L,
-                    elementRef: h,
-                    flex: true,
-                    inline: y,
-                    onClick: this.handleBoxClick
-                }, R), U,  n().createElement(Q, he({
-                    $hasEndAdornment: ne,
-                    $hasStartAdornment: ee,
-                    $isDisabled: f === true,
-                    $isDimmed: f === "dimmed"
-                }, V), ee &&  n().createElement(te, {
-                    $width: this.state.startAdornmentWidth
-                }), f ?  n().createElement(X, he({
-                    className: (0, T.toClassName)(p, u),
-                    "data-test": "textbox",
-                    disabled: f === true,
-                    readOnly: true,
-                    type: F,
-                    value: W,
-                    placeholder: I && !N ? I : undefined
-                }, M)) :  n().createElement(X, he({}, H, {
-                    onClick: this.handleInputClick
-                })), K &&  n().createElement(S(), null, I), K &&  n().createElement(Z, {
-                    $endAdornmentWidth: this.state.endAdornmentWidth,
-                    $hasBothAdornment: ee && ne,
-                    $hasEndAdornment: ne,
-                    $hasStartAdornment: ee,
-                    $startAdornmentWidth: this.state.startAdornmentWidth,
-                    "aria-hidden": true,
-                    "data-role": "placeholder"
-                }, I), s, ne &&  n().createElement(re, {
-                    $width: this.state.endAdornmentWidth
-                })), Y);
+                return n().createElement(R, Q({
+                    "data-test": "start-adornment",
+                    onClick: De
+                }, e), se);
             }
-        } ]);
-        return r;
-    }(r.Component);
-    Oe(Pe, "propTypes", $e);
-    Oe(Pe, "defaultProps", je);
-    Oe(Pe, "componentType", "Text");
-    Oe(Pe, "contextType", f.ControlGroupContext);
-    var _e = (0, O.withSplunkTheme)(Pe);
-    var De = _e;
-    De.propTypes = Pe.propTypes;
-    De.componentType = Pe.componentType;
-    /* harmony default export */    const Be = De;
+            return undefined;
+        }), [ w, De, se ]);
+        (0, t.useEffect)((function() {
+            if (false) {}
+        }), [ y, re ]);
+        var ze = (0, t.useMemo)((function() {
+            return G(G({
+                role: "textbox"
+            }, d()(me, (function(e, r) {
+                return r === "role" || r.indexOf("aria-") === 0;
+            }))), {}, {
+                "aria-describedby": O,
+                "aria-labelledby": z,
+                "aria-invalid": B || undefined,
+                "aria-disabled": w === "dimmed"
+            });
+        }), [ O, w, B, z, me ]);
+        var Ve = G({
+            $append: a || undefined,
+            $error: B,
+            $prepend: ae || undefined
+        }, s()(me, [ "inputRef", "onBlur", "onClick", "onChange", "onFocus", "onKeyDown", "onSelect" ].concat(M(l()(ze)))));
+        var Ke = je ? "password" : "text";
+        var Le = re ? Ke : pe;
+        var Ge = G(G({}, ze), {}, {
+            "data-test": "textbox",
+            autoCapitalize: i,
+            autoComplete: u,
+            autoCorrect: c,
+            autoFocus: p,
+            className: q,
+            id: D,
+            maxLength: V,
+            name: K,
+            onChange: Be,
+            onKeyDown: _e,
+            onSelect: Re,
+            onClick: Pe,
+            onFocus: $e,
+            onBlur: Ae,
+            placeholder: te,
+            ref: Ne,
+            required: le,
+            spellCheck: ue,
+            title: ve,
+            tabIndex: de,
+            type: Le,
+            value: Te,
+            $error: B
+        });
+        // Do not render value in DOM when type is password, or passwordVisibilityToggle is enabled
+                var Ue = pe === "password" || re ? undefined : Te;
+        // Firefox hack (SUI-2716). Remove when fixed: https://bugzilla.mozilla.org/show_bug.cgi?id=1427173
+                var Xe = pe === "time";
+        
+        return n().createElement(_, Q({
+            tabIndex: -1,
+            $isTimeInput: Xe,
+            "data-test": "text",
+            "data-test-value": Ue,
+            elementRef: j,
+            flex: true,
+            inline: P,
+            onClick: qe,
+            $disabled: !!w
+        }, Ve), Me(), w ?  n().createElement(N, Q({
+            className: q,
+            "data-test": "textbox",
+            disabled: w === true,
+            placeholder: te,
+            readOnly: true,
+            type: Le,
+            value: Te
+        }, ze)) :  n().createElement(N, Q({}, Ge, {
+            onClick: Pe
+        })), C, He());
+    }
+    le.propTypes = ae;
+    le.componentType = "Text";
+    /* harmony default export */    const ue = le;
     // only for styled components using Text
         // CONCATENATED MODULE: ./src/Text/index.ts
-    module.exports = t;
+    module.exports = r;
     /******/})();