@splunk/react-ui 5.0.0-beta.3 → 5.0.0-beta.5

package/Tooltip.js

@@ -8,27 +8,27 @@
     /******/ /* webpack/runtime/compat get default export */
     /******/    (() => {
         /******/ // getDefaultExport function for compatibility with non-harmony modules
-        /******/ e.n = t => {
-            /******/ var n = t && t.__esModule ? 
-            /******/ () => t["default"]
-            /******/ : () => t
+        /******/ e.n = n => {
+            /******/ var t = n && n.__esModule ? 
+            /******/ () => n["default"]
+            /******/ : () => n
             /******/;
-            e.d(n, {
-                a: n
+            e.d(t, {
+                a: t
             });
-            /******/            return n;
+            /******/            return t;
             /******/        };
         /******/    })();
     /******/
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ e.d = (t, n) => {
-            /******/ for (var r in n) {
-                /******/ if (e.o(n, r) && !e.o(t, r)) {
-                    /******/ Object.defineProperty(t, r, {
+        /******/ e.d = (n, t) => {
+            /******/ for (var r in t) {
+                /******/ if (e.o(t, r) && !e.o(n, r)) {
+                    /******/ Object.defineProperty(n, r, {
                         enumerable: true,
-                        get: n[r]
+                        get: t[r]
                     });
                     /******/                }
                 /******/            }
@@ -37,7 +37,7 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ e.o = (e, t) => Object.prototype.hasOwnProperty.call(e, t)
+        /******/ e.o = (e, n) => Object.prototype.hasOwnProperty.call(e, n)
         /******/;
     })();
     /******/
@@ -56,312 +56,226 @@
             /******/        };
         /******/    })();
     /******/
-    /************************************************************************/    var t = {};
+    /************************************************************************/    var n = {};
     // ESM COMPAT FLAG
-        e.r(t);
+        e.r(n);
     // EXPORTS
-        e.d(t, {
-        default: () => /* reexport */ ae
+        e.d(n, {
+        default: () => /* reexport */ Q
     });
     // CONCATENATED MODULE: external "react"
-    const n = require("react");
-    var r =  e.n(n);
+    const t = require("react");
+    var r =  e.n(t);
     // CONCATENATED MODULE: external "prop-types"
     const o = require("prop-types");
     var a =  e.n(o);
-    // CONCATENATED MODULE: external "lodash/has"
-    const i = require("lodash/has");
-    var l =  e.n(i);
-    // CONCATENATED MODULE: external "lodash/omit"
-    const s = require("lodash/omit");
-    var u =  e.n(s);
     // CONCATENATED MODULE: external "lodash/throttle"
-    const c = require("lodash/throttle");
-    var p =  e.n(c);
+    const l = require("lodash/throttle");
+    var i =  e.n(l);
+    // CONCATENATED MODULE: external "@splunk/react-icons/InformationCircle"
+    const u = require("@splunk/react-icons/InformationCircle");
+    var c =  e.n(u);
     // CONCATENATED MODULE: external "@splunk/react-ui/Popover"
-    const d = require("@splunk/react-ui/Popover");
-    var f =  e.n(d);
+    const s = require("@splunk/react-ui/Popover");
+    var f =  e.n(s);
     // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
     const v = require("@splunk/react-ui/ScreenReaderContent");
-    var h =  e.n(v);
-    // CONCATENATED MODULE: external "@splunk/themes"
-    const m = require("@splunk/themes");
-    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
-    const y = require("@splunk/ui-utils/id");
+    var p =  e.n(v);
+    // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
+    const d = require("@splunk/react-ui/useControlled");
+    var m =  e.n(d);
     // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
     const b = require("@splunk/ui-utils/i18n");
-    // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
-    /**
- * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
- *
- * @param ref - The React callback or object ref. Can be `null` or `undefined`.
- * @param current - The new value of the ref.
- */
-    function g(e, t) {
-        if (e) {
-            if (typeof e === "function") {
-                e(t);
-            } 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;
- // eslint-disable-line no-param-reassign
-                        }
-        }
-    }
-    // CONCATENATED MODULE: external "@splunk/react-icons/SVGEnterprise"
-    const O = require("@splunk/react-icons/SVGEnterprise");
-    var E =  e.n(O);
-    // CONCATENATED MODULE: ./src/Tooltip/InfoIcon.tsx
-    function C() {
-        return C = Object.assign ? Object.assign.bind() : function(e) {
-            for (var t = 1; t < arguments.length; t++) {
-                var n = arguments[t];
-                for (var r in n) {
-                    ({}).hasOwnProperty.call(n, r) && (e[r] = n[r]);
-                }
-            }
-            return e;
-        }, C.apply(null, arguments);
-    }
-    function M(e) {
-        var t = (0, m.useSplunkTheme)(), n = t.family, o = t.density;
-        if (n === "enterprise") {
-            
-            return r().createElement(E(), C({
-                screenReaderText: (0, b._)("Info Circle"),
-                viewBox: "0 0 24 24"
-            }, e),  r().createElement("path", {
-                fill: "currentColor",
-                d: "M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM13.2001 8.1999C13.2001 7.53716 12.6628 6.9999 12.0001 6.9999C11.3373 6.9999 10.8001 7.53716 10.8001 8.1999C10.8001 8.86264 11.3373 9.3999 12.0001 9.3999C12.6628 9.3999 13.2001 8.86264 13.2001 8.1999ZM11.0001 16.0094V11.9999C11.0001 11.4476 11.4478 10.9999 12.0001 10.9999C12.5524 10.9999 13.0001 11.4476 13.0001 11.9999V16.0094C13.0001 16.5617 12.5524 17.0094 12.0001 17.0094C11.4478 17.0094 11.0001 16.5617 11.0001 16.0094Z"
-            }));
-        }
-        var a = o === "compact" ? "20" : "24";
-        
-        return r().createElement("svg", {
-            width: a,
-            height: a,
-            viewBox: "0 0 24 24",
-            xmlns: "http://www.w3.org/2000/svg",
-            style: {
-                display: "block"
-            }
-        },  r().createElement("path", {
-            d: "M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM13.2003 8.1999C13.2003 7.53716 12.663 6.9999 12.0003 6.9999C11.3376 6.9999 10.8003 7.53716 10.8003 8.1999C10.8003 8.86264 11.3376 9.3999 12.0003 9.3999C12.663 9.3999 13.2003 8.86264 13.2003 8.1999ZM11.0005 16.0094V11.9999C11.0005 11.4476 11.4482 10.9999 12.0005 10.9999C12.5528 10.9999 13.0005 11.4476 13.0005 11.9999V16.0094C13.0005 16.5617 12.5528 17.0094 12.0005 17.0094C11.4482 17.0094 11.0005 16.5617 11.0005 16.0094Z",
-            fill: "currentColor",
-            fillRule: "evenodd"
-        }));
-    }
-    /* harmony default export */    const P = M;
+    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
+    const y = require("@splunk/ui-utils/id");
     // CONCATENATED MODULE: external "styled-components"
-    const S = require("styled-components");
-    var w =  e.n(S);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
-    const k = require("@splunk/react-ui/Clickable");
-    var R =  e.n(k);
+    const g = require("styled-components");
+    var h =  e.n(g);
+    // CONCATENATED MODULE: external "@splunk/react-ui/Button"
+    const O = require("@splunk/react-ui/Button");
+    var S =  e.n(O);
+    // CONCATENATED MODULE: external "@splunk/themes"
+    const C = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Tooltip/TooltipStyles.ts
-    var T = "16px";
-    var j = w().span.withConfig({
+    var k = h().span.withConfig({
         displayName: "TooltipStyles__Styled",
         componentId: "sc-67fvgm-0"
-    })([ "", ";position:relative;" ], m.mixins.reset("block"));
-    var q = w().span.withConfig({
+    })([ "", ";position:relative;" ], C.mixins.reset("block"));
+    var E = h().span.withConfig({
         displayName: "TooltipStyles__StyledInline",
         componentId: "sc-67fvgm-1"
-    })([ "", ";position:relative;" ], m.mixins.reset("inline-block"));
-    var A = w().span.withConfig({
+    })([ "", ";position:relative;" ], C.mixins.reset("inline-block"));
+    var P = h().span.withConfig({
         displayName: "TooltipStyles__StyledToggle",
         componentId: "sc-67fvgm-2"
     })([ "display:block;" ]);
-    var L = w().span.withConfig({
+    var T = h().span.withConfig({
         displayName: "TooltipStyles__StyledToggleInline",
         componentId: "sc-67fvgm-3"
     })([ "display:inline-block;" ]);
-    var I = w().div.withConfig({
+    var j = h().div.withConfig({
         displayName: "TooltipStyles__StyledContent",
         componentId: "sc-67fvgm-4"
-    })([ "padding:", ";font-size:", ";line-height:", ";user-select:none;" ], (0, m.pick)({
-        enterprise: m.variables.spacingSmall,
-        prisma: (0, m.pickVariant)("$isLabel", {
-            false: "12px 16px",
-            true: "4px 8px"
-        })
-    }), (0, m.pick)({
-        enterprise: m.variables.fontSizeSmall,
-        prisma: "inherit"
-    }), (0, m.pick)({
-        enterprise: "18px",
-        prisma: (0, m.pickVariant)("$isLabel", {
-            false: "inherit",
-            true: "18px"
-        })
-    }));
-    var x = w()(R()).withConfig({
+    })([ "", ";padding:", ";user-select:none;" ], C.mixins.typography("smallBody", {
+        color: "active"
+    }), C.variables.spacingSmall);
+    var w = h()(S()).withConfig({
         displayName: "TooltipStyles__StyledButton",
         componentId: "sc-67fvgm-5"
-    })([ "cursor:default;", " ", " &:focus{box-shadow:", ";}" ], (0, m.pick)({
-        enterprise: (0, S.css)([ "display:inline-block;width:", ";height:", ";border:2px solid ", ";border-radius:", ";font-size:", ";font-weight:", ";line-height:calc(", " - 2px);text-align:center;color:", ";vertical-align:baseline;&:not([disabled]){&:hover{text-decoration:none;}}" ], T, T, m.variables.contentColorLink, T, m.variables.fontSizeSmall, m.variables.fontWeightSemiBold, T, m.variables.contentColorLink),
-        prisma: (0, S.css)([ "color:", ";border-radius:50%;display:inline-block;vertical-align:middle;&:hover,&:focus{color:", ";background:", ";}" ], m.variables.contentColorMuted, m.variables.contentColorActive, m.variables.interactiveColorOverlayHover)
-    }), (0, m.pick)({
-        prisma: {
-            comfortable: (0, S.css)([ "padding:8px;" ]),
-            compact: (0, S.css)([ "padding:6px;" ])
+    })([ "cursor:help;border-radius:50%;" ]);
+    // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
+    /**
+ * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
+ *
+ * @param ref - The React callback or object ref. Can be `null` or `undefined`.
+ * @param current - The new value of the ref.
+ */
+    function R(e, n) {
+        if (e) {
+            if (typeof e === "function") {
+                e(n);
+            } 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 = n;
+ // eslint-disable-line no-param-reassign
+                        }
         }
-    }), m.variables.focusShadow);
+    }
     // CONCATENATED MODULE: ./src/Tooltip/Tooltip.tsx
-    function _(e) {
+    function q(e) {
         "@babel/helpers - typeof";
-        return _ = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
+        return q = "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;
-        }, _(e);
+        }, q(e);
     }
-    function B() {
-        return B = Object.assign ? Object.assign.bind() : function(e) {
-            for (var t = 1; t < arguments.length; t++) {
-                var n = arguments[t];
-                for (var r in n) {
-                    ({}).hasOwnProperty.call(n, r) && (e[r] = n[r]);
+    function I() {
+        return I = Object.assign ? Object.assign.bind() : function(e) {
+            for (var n = 1; n < arguments.length; n++) {
+                var t = arguments[n];
+                for (var r in t) {
+                    ({}).hasOwnProperty.call(t, r) && (e[r] = t[r]);
                 }
             }
             return e;
-        }, B.apply(null, arguments);
-    }
-    function D(e, t) {
-        if (null == e) return {};
-        var n, r, o = H(e, t);
-        if (Object.getOwnPropertySymbols) {
-            var a = Object.getOwnPropertySymbols(e);
-            for (r = 0; r < a.length; r++) {
-                n = a[r], t.includes(n) || {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
-            }
-        }
-        return o;
-    }
-    function H(e, t) {
-        if (null == e) return {};
-        var n = {};
-        for (var r in e) {
-            if ({}.hasOwnProperty.call(e, r)) {
-                if (t.includes(r)) continue;
-                n[r] = e[r];
-            }
-        }
-        return n;
+        }, I.apply(null, arguments);
     }
-    function V(e, t) {
-        var n = Object.keys(e);
+    function L(e, n) {
+        var t = Object.keys(e);
         if (Object.getOwnPropertySymbols) {
             var r = Object.getOwnPropertySymbols(e);
-            t && (r = r.filter((function(t) {
-                return Object.getOwnPropertyDescriptor(e, t).enumerable;
-            }))), n.push.apply(n, r);
+            n && (r = r.filter((function(n) {
+                return Object.getOwnPropertyDescriptor(e, n).enumerable;
+            }))), t.push.apply(t, r);
         }
-        return n;
+        return t;
     }
-    function Z(e) {
-        for (var t = 1; t < arguments.length; t++) {
-            var n = null != arguments[t] ? arguments[t] : {};
-            t % 2 ? V(Object(n), !0).forEach((function(t) {
-                X(e, t, n[t]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : V(Object(n)).forEach((function(t) {
-                Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
+    function _(e) {
+        for (var n = 1; n < arguments.length; n++) {
+            var t = null != arguments[n] ? arguments[n] : {};
+            n % 2 ? L(Object(t), !0).forEach((function(n) {
+                D(e, n, t[n]);
+            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : L(Object(t)).forEach((function(n) {
+                Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(t, n));
             }));
         }
         return e;
     }
-    function F(e, t) {
-        if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function");
-    }
-    function N(e, t) {
-        for (var n = 0; n < t.length; n++) {
-            var r = t[n];
-            r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0), 
-            Object.defineProperty(e, Y(r.key), r);
-        }
+    function D(e, n, t) {
+        return (n = A(n)) in e ? Object.defineProperty(e, n, {
+            value: t,
+            enumerable: !0,
+            configurable: !0,
+            writable: !0
+        }) : e[n] = t, e;
     }
-    function W(e, t, n) {
-        return t && N(e.prototype, t), n && N(e, n), Object.defineProperty(e, "prototype", {
-            writable: !1
-        }), e;
+    function A(e) {
+        var n = N(e, "string");
+        return "symbol" == q(n) ? n : n + "";
     }
-    function z(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
-            }
-        }), Object.defineProperty(e, "prototype", {
-            writable: !1
-        }), t && $(e, t);
+    function N(e, n) {
+        if ("object" != q(e) || !e) return e;
+        var t = e[Symbol.toPrimitive];
+        if (void 0 !== t) {
+            var r = t.call(e, n || "default");
+            if ("object" != q(r)) return r;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return ("string" === n ? String : Number)(e);
     }
-    function $(e, t) {
-        return $ = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(e, t) {
-            return e.__proto__ = t, e;
-        }, $(e, t);
+    function B(e, n) {
+        return W(e) || H(e, n) || x(e, n) || M();
     }
-    function U(e) {
-        var t = J();
-        return function() {
-            var n, r = Q(e);
-            if (t) {
-                var o = Q(this).constructor;
-                n = Reflect.construct(r, arguments, o);
-            } else n = r.apply(this, arguments);
-            return G(this, n);
-        };
+    function M() {
+        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 G(e, t) {
-        if (t && ("object" == _(t) || "function" == typeof t)) return t;
-        if (void 0 !== t) throw new TypeError("Derived constructors may only return object or undefined");
-        return K(e);
+    function x(e, n) {
+        if (e) {
+            if ("string" == typeof e) return F(e, n);
+            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) ? F(e, n) : void 0;
+        }
     }
-    function K(e) {
-        if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-        return e;
+    function F(e, n) {
+        (null == n || n > e.length) && (n = e.length);
+        for (var t = 0, r = Array(n); t < n; t++) {
+            r[t] = e[t];
+        }
+        return r;
     }
-    function J() {
-        try {
-            var e = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], (function() {})));
-        } catch (e) {}
-        return (J = function t() {
-            return !!e;
-        })();
+    function H(e, n) {
+        var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+        if (null != t) {
+            var r, o, a, l, i = [], u = !0, c = !1;
+            try {
+                if (a = (t = t.call(e)).next, 0 === n) {
+                    if (Object(t) !== t) return;
+                    u = !1;
+                } else for (;!(u = (r = a.call(t)).done) && (i.push(r.value), i.length !== n); u = !0) {
+                }
+            } catch (e) {
+                c = !0, o = e;
+            } finally {
+                try {
+                    if (!u && null != t["return"] && (l = t["return"](), Object(l) !== l)) return;
+                } finally {
+                    if (c) throw o;
+                }
+            }
+            return i;
+        }
     }
-    function Q(e) {
-        return Q = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(e) {
-            return e.__proto__ || Object.getPrototypeOf(e);
-        }, Q(e);
+    function W(e) {
+        if (Array.isArray(e)) return e;
     }
-    function X(e, t, n) {
-        return (t = Y(t)) in e ? Object.defineProperty(e, t, {
-            value: n,
-            enumerable: !0,
-            configurable: !0,
-            writable: !0
-        }) : e[t] = n, e;
-    }
-    function Y(e) {
-        var t = ee(e, "string");
-        return "symbol" == _(t) ? t : t + "";
+    function V(e, n) {
+        if (null == e) return {};
+        var t, r, o = K(e, n);
+        if (Object.getOwnPropertySymbols) {
+            var a = Object.getOwnPropertySymbols(e);
+            for (r = 0; r < a.length; r++) {
+                t = a[r], n.includes(t) || {}.propertyIsEnumerable.call(e, t) && (o[t] = e[t]);
+            }
+        }
+        return o;
     }
-    function ee(e, t) {
-        if ("object" != _(e) || !e) return e;
-        var n = e[Symbol.toPrimitive];
-        if (void 0 !== n) {
-            var r = n.call(e, t || "default");
-            if ("object" != _(r)) return r;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
+    function K(e, n) {
+        if (null == e) return {};
+        var t = {};
+        for (var r in e) {
+            if ({}.hasOwnProperty.call(e, r)) {
+                if (n.includes(r)) continue;
+                t[r] = e[r];
+            }
         }
-        return ("string" === t ? String : Number)(e);
+        return t;
     }
     /** @public */
     /** @public */
     /** @public */
-    /** @public */    var te = {
+    /** @public */    var U = {
         /** @private */
         appearance: a().string,
         children: a().node,
@@ -377,332 +291,268 @@
         onRequestOpen: a().func,
         open: a().bool,
         openDelay: a().oneOfType([ a().oneOf([ "primary", "secondary" ]), a().number ]),
-        renderAnchor: a().func,
-        /** @private */
-        splunkTheme: a().object
+        renderAnchor: a().func
     };
-    var ne = {
-        closeDelay: 300,
-        closeWhen: "default",
-        defaultPlacement: "above",
-        inline: true,
-        openDelay: "primary"
+    var $ = {
+        tension: 400
     };
+    var z = [ "offScreen", "escapeKey" ];
+    var G =  r().createElement(c(), null);
     /**
  * The Tooltip component wraps arbitrary content to be displayed when the target element is hovered
  * or focused.
- */    var re =  function(e) {
-        z(o, e);
-        var t = U(o);
+ */    function J(e) {
+        var n = e.appearance, o = e.children, a = e.closeDelay, l = a === void 0 ? 300 : a, u = e.closeWhen, c = u === void 0 ? "default" : u, s = e.content, v = e.contentRelationship, d = e.defaultPlacement, g = d === void 0 ? "above" : d, h = e.elementRef, O = e.inline, S = O === void 0 ? true : O, C = e.onRequestClose, q = e.onRequestOpen, L = e.open, D = e.openDelay, A = D === void 0 ? "primary" : D, N = e.renderAnchor, M = V(e, [ "appearance", "children", "closeDelay", "closeWhen", "content", "contentRelationship", "defaultPlacement", "elementRef", "inline", "onRequestClose", "onRequestOpen", "open", "openDelay", "renderAnchor" ]);
         // @docs-props-type TooltipPropsBase
-                function o(e) {
-            var n;
-            F(this, o);
-            n = t.call(this, e);
-            X(K(n), "ariaId", void 0);
-            X(K(n), "controlledExternally", void 0);
-            X(K(n), "popoverId", void 0);
-            X(K(n), "timeout", void 0);
-            X(K(n), "handleMount", (function(e) {
-                // Handle mouse events with native events due to current issues with how they
-                // are handled by react. See https://github.com/facebook/react/issues/4251,
-                // https://github.com/facebook/react/issues/19419, and SUI-1232.
-                if (e) {
-                    e.addEventListener("mouseenter", n.handleMouseEnter);
-                    e.addEventListener("mouseleave", n.handleMouseLeave);
-                } else if (n.state.anchorEl) {
-                    n.state.anchorEl.removeEventListener("mouseenter", n.handleMouseEnter);
-                    n.state.anchorEl.removeEventListener("mouseleave", n.handleMouseLeave);
-                }
-                n.setState({
-                    anchorEl: e
-                });
-            }));
-            X(K(n), "handlePopoverMount", (function(e) {
-                if (e) {
-                    e.addEventListener("mouseenter", n.handleMouseEnterPopover);
-                    e.addEventListener("mouseleave", n.handleMouseLeavePopover);
-                } else if (n.state.popoverEl) {
-                    n.state.popoverEl.removeEventListener("mouseenter", n.handleMouseEnterPopover);
-                    n.state.popoverEl.removeEventListener("mouseleave", n.handleMouseLeavePopover);
+                var x = (0, t.useState)(false), F = B(x, 2), H = F[0], W = F[1];
+        var K = (0, t.useState)(null), U = B(K, 2), J = U[0], Q = U[1];
+        var X = (0, t.useState)(null), Y = B(X, 2), Z = Y[0], ee = Y[1];
+        var ne = (0, t.useState)(null), te = B(ne, 2), re = te[0], oe = te[1];
+        var ae = (0, t.useState)(null), le = B(ae, 2), ie = le[0], ue = le[1];
+        var ce = (0, t.useState)((function() {
+            return {
+                ariaId: (0, y.createDOMID)("aria-id"),
+                popoverId: (0, y.createDOMID)("popover")
+            };
+        })), se = B(ce, 1), fe = se[0], ve = fe.ariaId, pe = fe.popoverId;
+        var de = m()({
+            componentName: "Tooltip",
+            /* eslint-disable-next-line prefer-rest-params */
+            componentProps: arguments[0],
+            // see SUI-7028
+            defaultValuePropName: "defaultOpen",
+            valuePropName: "open"
+        });
+        var me = (0, t.useMemo)((function() {
+            var e = !!s;
+            return !!J && de ? L : e && H;
+        }), [ J, s, de, H, L ]);
+        var be = (0, t.useRef)();
+        (0, t.useEffect)((function() {
+            return function() {
+                if (be.current !== undefined) {
+                    clearTimeout(be.current);
                 }
-                n.setState({
-                    popoverEl: e
-                });
-            }));
-            X(K(n), "handlePopoverOuterMount", (function(e) {
-                n.setState({
-                    popoverOuterEl: e
-                });
-            }));
-            X(K(n), "handleHitAreaMount", (function(e) {
-                // Handle mouse events with native events due to current issues with how they
-                // are handled by react. See https://github.com/facebook/react/issues/4251,
-                // https://github.com/facebook/react/issues/19419, and SUI-1232.
-                if (e) {
-                    e.addEventListener("mouseenter", n.handleMouseEnterHitArea);
-                    e.addEventListener("mousemove", n.handleMouseMoveHitArea);
-                    e.addEventListener("mouseleave", n.handleMouseLeaveHitArea);
-                } else if (n.state.hitAreaEl) {
-                    n.state.hitAreaEl.removeEventListener("mouseenter", n.handleMouseEnterHitArea);
-                    n.state.hitAreaEl.removeEventListener("mousemove", n.handleMouseMoveHitArea);
-                    n.state.hitAreaEl.removeEventListener("mouseleave", n.handleMouseLeaveHitArea);
+            };
+        }), []);
+        var ye = (0, t.useCallback)((function(e, n) {
+            if (be.current !== undefined) {
+                clearTimeout(be.current);
+            }
+            be.current = setTimeout((function() {
+                if (!de) {
+                    W(false);
                 }
-                n.setState({
-                    hitAreaEl: e
-                });
-            }));
-            X(K(n), "handleMouseEnter", (function(e) {
-                n.handleRequestOpen(e, {
-                    reason: "mouseEnterToggle"
-                });
-            }));
-            X(K(n), "handleMouseEnterPopover", (function(e) {
-                n.handleRequestOpen(e, {
-                    reason: "mouseEnterPopover"
-                });
-            }));
-            X(K(n), "handleMouseEnterHitArea", (function(e) {
-                n.handleRequestOpen(e, {
-                    reason: "mouseEnterHitArea"
-                });
-            }));
-            X(K(n), "handleMouseLeave", (function(e) {
-                var t = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "mouseLeaveToggle";
-                if (e.relatedTarget == null || e.relatedTarget !== n.state.popoverEl && e.relatedTarget !== n.state.popoverOuterEl) {
-                    n.handleRequestClose(e, {
-                        reason: t
-                    });
+                C === null || C === void 0 ? void 0 : C(e, n);
+            }), l);
+        }), [ l, de, C ]);
+        var ge = (0, t.useCallback)((function(e, n) {
+            var t = A === "primary" ? 300 : 750;
+            var r = typeof A === "number" ? A : t;
+            if (be.current !== undefined) {
+                clearTimeout(be.current);
+            }
+            be.current = setTimeout((function() {
+                var t = me;
+                if (!de) {
+                    W(true);
                 }
-            }));
-            X(K(n), "handleMouseLeavePopover", (function(e) {
-                n.handleMouseLeave(e, "mouseLeavePopover");
-            }));
-            X(K(n), "handleMouseLeaveHitArea", (function(e) {
-                n.handleMouseLeave(e, "mouseLeaveHitArea");
-            }));
-            X(K(n), "handleMouseMoveHitAreaImpl", (function(e) {
-                n.handleRequestClose(e, {
-                    reason: "mouseStopHitArea"
-                });
-            }));
-            X(K(n), "handleMouseMoveHitArea", p()(n.handleMouseMoveHitAreaImpl, 10));
-            X(K(n), "handleClick", (function(e) {
-                if (n.props.closeWhen !== "notOnClick") {
-                    n.handleRequestClose(e, {
-                        reason: "toggleClick"
-                    });
+                if (!t) {
+                    q === null || q === void 0 ? void 0 : q(e, n);
                 }
-            }));
-            X(K(n), "handleFocus", (function(e) {
-                n.handleRequestOpen(e, {
-                    reason: "focusToggle"
-                });
-            }));
-            X(K(n), "handleBlur", (function(e) {
-                n.handleRequestClose(e, {
-                    reason: "blurToggle"
+            }), r);
+        }), [ de, me, q, A ]);
+        var he = (0, t.useCallback)((function(e) {
+            ge(e, {
+                reason: "mouseEnterToggle"
+            });
+        }), [ ge ]);
+        var Oe = (0, t.useCallback)((function(e) {
+            ge(e, {
+                reason: "mouseEnterPopover"
+            });
+        }), [ ge ]);
+        var Se = (0, t.useCallback)((function(e) {
+            ge(e, {
+                reason: "mouseEnterHitArea"
+            });
+        }), [ ge ]);
+        var Ce = (0, t.useCallback)((function(e) {
+            var n = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "mouseLeaveToggle";
+            if (e.relatedTarget == null || e.relatedTarget !== re && e.relatedTarget !== ie) {
+                ye(e, {
+                    reason: n
                 });
-            }));
-            X(K(n), "handlePopoverOnRequestClose", (function(e) {
-                n.handleRequestClose(null, e);
-            }));
-            X(K(n), "handleRequestClose", (function(e, t) {
-                var r = n.props.closeDelay;
-                if (n.timeout !== undefined) {
-                    clearTimeout(n.timeout);
-                }
-                n.timeout = setTimeout((function() {
-                    var r, o;
-                    if (!n.isControlled()) {
-                        n.setState({
-                            open: false
-                        });
-                    }
-                    (r = (o = n.props).onRequestClose) === null || r === void 0 ? void 0 : r.call(o, e, t);
-                }), r);
-            }));
-            X(K(n), "handleRequestOpen", (function(e, t) {
-                var r = n.props.openDelay;
-                var o = r === "primary" ? 300 : 750;
-                var a = typeof r === "number" ? r : o;
-                if (n.timeout !== undefined) {
-                    clearTimeout(n.timeout);
-                }
-                n.timeout = setTimeout((function() {
-                    var r = n.isOpen();
-                    if (!n.isControlled()) {
-                        n.setState({
-                            open: true
-                        });
-                    }
-                    if (!r) {
-                        var o, a;
-                        (o = (a = n.props).onRequestOpen) === null || o === void 0 ? void 0 : o.call(a, e, t);
-                    }
-                }), a);
-            }));
-            X(K(n), "handleRenderPropAnchorMount", (function(e) {
-                var t = n.props.elementRef;
-                n.handleMount(e);
-                g(t, e);
-            }));
-            n.controlledExternally = l()(e, "open");
-            n.popoverId = (0, y.createDOMID)("popover");
-            n.ariaId = (0, y.createDOMID)("aria-id");
-            n.state = {
-                anchorEl: null,
-                open: false,
-                popoverEl: null,
-                popoverOuterEl: null,
-                hitAreaEl: null
-            };
-            return n;
-        }
-        W(o, [ {
-            key: "componentDidUpdate",
-            value: function e() {
-                if (false) {}
             }
-        }, {
-            key: "componentWillUnmount",
-            value: function e() {
-                if (this.timeout !== undefined) {
-                    clearTimeout(this.timeout);
-                }
+        }), [ ye, re, ie ]);
+        var ke = (0, t.useCallback)((function(e) {
+            Ce(e, "mouseLeavePopover");
+        }), [ Ce ]);
+        var Ee = (0, t.useCallback)((function(e) {
+            Ce(e, "mouseLeaveHitArea");
+        }), [ Ce ]);
+        var Pe = (0, t.useCallback)((function(e) {
+            ye(e, {
+                reason: "mouseStopHitArea"
+            });
+        }), [ ye ]);
+        var Te = i()(Pe, 10);
+        var je = (0, t.useCallback)((function(e) {
+            // Handle mouse events with native events due to current issues with how they
+            // are handled by react. See https://github.com/facebook/react/issues/4251,
+            // https://github.com/facebook/react/issues/19419, and SUI-1232.
+            if (e) {
+                e.addEventListener("mouseenter", he);
+                e.addEventListener("mouseleave", Ce);
+            } else if (J) {
+                J.removeEventListener("mouseenter", he);
+                J.removeEventListener("mouseleave", Ce);
+            }
+            Q(e);
+        }), [ J, he, Ce ]);
+        var we = (0, t.useCallback)((function(e) {
+            if (e) {
+                e.addEventListener("mouseenter", Oe);
+                e.addEventListener("mouseleave", ke);
+            } else if (re) {
+                re.removeEventListener("mouseenter", Oe);
+                re.removeEventListener("mouseleave", ke);
             }
-        }, {
-            key: "isControlled",
-            value: function e() {
-                return this.controlledExternally;
+            oe(e);
+        }), [ Oe, ke, re ]);
+        var Re = (0, t.useCallback)((function(e) {
+            ue(e);
+        }), []);
+        var qe = (0, t.useCallback)((function(e) {
+            // Handle mouse events with native events due to current issues with how they
+            // are handled by react. See https://github.com/facebook/react/issues/4251,
+            // https://github.com/facebook/react/issues/19419, and SUI-1232.
+            if (e) {
+                e.addEventListener("mouseenter", Se);
+                e.addEventListener("mousemove", Te);
+                e.addEventListener("mouseleave", Ee);
+            } else if (Z) {
+                Z.removeEventListener("mouseenter", Se);
+                Z.removeEventListener("mousemove", Te);
+                Z.removeEventListener("mouseleave", Ee);
             }
-        }, {
-            key: "isOpen",
-            value: function e() {
-                var t = !!this.props.content;
-                return !!this.state.anchorEl && this.isControlled() ? this.props.open : t && this.state.open;
+            ee(e);
+        }), [ Se, Ee, Te, Z ]);
+        var Ie = (0, t.useCallback)((function(e) {
+            if (c !== "notOnClick") {
+                ye(e, {
+                    reason: "toggleClick"
+                });
+            }
+        }), [ c, ye ]);
+        var Le = (0, t.useCallback)((function(e) {
+            ge(e, {
+                reason: "focusToggle"
+            });
+        }), [ ge ]);
+        var _e = (0, t.useCallback)((function(e) {
+            ye(e, {
+                reason: "blurToggle"
+            });
+        }), [ ye ]);
+        var De = (0, t.useCallback)((function(e) {
+            ye(null, e);
+        }), [ ye ]);
+        var Ae = (0, t.useCallback)((function(e) {
+            je(e);
+            R(h, e);
+        }), [ h, je ]);
+        var Ne = (0, t.useCallback)((function() {
+            if (false) {}
+            var e = {
+                onBlur: _e,
+                onFocus: Le,
+                onClick: Ie,
+                elementRef: Ae,
+                "data-test": "toggle"
+            };
+            if (v === "label") {
+                return N === null || N === void 0 ? void 0 : N(_(_({}, e), {}, {
+                    "aria-labelledby": ve,
+                    labelledBy: ve
+                }));
             }
-        }, {
-            key: "createAnchor",
-            value: function e() {
-                var t = this.props, o = t.children, a = t.inline, i = t.renderAnchor, l = t.splunkTheme;
-                if (i) {
-                    var s, c;
-                    if (false) {}
-                    var p = {
-                        onBlur: this.handleBlur,
-                        onFocus: this.handleFocus,
-                        onClick: this.handleClick,
-                        elementRef: this.handleRenderPropAnchorMount,
-                        "data-test": "toggle"
+            return N === null || N === void 0 ? void 0 : N(_(_({}, e), {}, {
+                "aria-describedby": ve,
+                describedBy: ve
+            }));
+        }), [ ve, o, v, _e, Ie, Le, Ae, N ]);
+        var Be = (0, t.useCallback)((function() {
+            var e = S ? T : P;
+            var n;
+            if ( (0, t.isValidElement)(o)) {
+                var a;
+                if (v === "label") {
+                    a = {
+                        labelledBy: ve,
+                        "aria-labelledby": ve
                     };
-                    if (this.props.contentRelationship === "label") {
-                        var d, f;
-                        return (d = (f = this.props).renderAnchor) === null || d === void 0 ? void 0 : d.call(f, Z(Z({}, u()(p, "describedBy", "aria-describedby")), {}, {
-                            "aria-labelledby": this.ariaId,
-                            labelledBy: this.ariaId
-                        }));
-                    }
-                    return (s = (c = this.props).renderAnchor) === null || s === void 0 ? void 0 : s.call(c, Z(Z({}, u()(p, "labelledBy", "aria-labelledBy")), {}, {
-                        "aria-describedby": this.ariaId,
-                        describedBy: this.ariaId
-                    }));
-                }
-                var v = a ? L : A;
-                var m;
-                if ( (0, n.isValidElement)(o)) {
-                    var y;
-                    if (this.props.contentRelationship === "label") {
-                        y = {
-                            labelledBy: this.ariaId,
-                            "aria-labelledby": this.ariaId
-                        };
-                    } else {
-                        y = {
-                            describedBy: this.ariaId,
-                            "aria-describedby": this.ariaId
-                        };
-                    }
-                    m =  (0, n.cloneElement)(o, y);
-                } else if (o) {
-                    m = o;
                 } else {
-                    var g = l.isEnterprise;
-                    m =  r().createElement(x, {
-                        "aria-describedby": this.ariaId
-                    }, g ?  r().createElement(r().Fragment, null,  r().createElement("span", {
-                        "aria-hidden": "true"
-                    }, "?"),  r().createElement(h(), null, (0, b._)("More info"))) :  r().createElement(P, {
-                        hideDefaultTooltip: true,
-                        screenReaderText: (0, b._)("More info"),
-                        style: {
-                            height: "22px",
-                            width: "22px"
-                        }
-                    }));
-                }
-                
-                return r().createElement(v, {
-                    onClick: this.handleClick,
-                    onFocus: this.handleFocus,
-                    onBlur: this.handleBlur,
-                    ref: this.handleMount,
-                    "data-test": "toggle"
-                }, m);
-            }
-        }, {
-            key: "render",
-            value: function e() {
-                var t = this.props, n = t.appearance, o = t.content, a = t.defaultPlacement, i = t.elementRef, l = t.inline, s = t.onRequestClose, u = t.onRequestOpen, c = t.contentRelationship, p = t.renderAnchor, d = D(t, [ "appearance", "content", "defaultPlacement", "elementRef", "inline", "onRequestClose", "onRequestOpen", "contentRelationship", "renderAnchor" ]);
-                var v = this.state.anchorEl;
-                var m = !!o;
-                var y = this.isOpen();
-                var b = l ? q : j;
-                var g = this.createAnchor();
-                var O = m &&  r().createElement(h(), {
-                    "aria-hidden": "true",
-                    id: this.ariaId
-                }, o);
-                var E =  r().createElement(f(), {
-                    role: "tooltip",
-                    align: "center",
-                    anchor: v,
-                    animationConfig: {
-                        tension: 400
-                    },
-                    appearance: n,
-                    closeReasons: [ "offScreen", "escapeKey" ],
-                    defaultPlacement: a,
-                    id: this.popoverId,
-                    open: y,
-                    onRequestClose: this.handlePopoverOnRequestClose,
-                    elementRef: this.handlePopoverMount,
-                    hitAreaRef: this.handleHitAreaMount,
-                    outerRef: this.handlePopoverOuterMount
-                },  r().createElement(I, {
-                    $isLabel: c === "label"
-                }, o));
-                if (p) {
-                    
-                    return r().createElement(r().Fragment, null, g, O, E);
+                    a = {
+                        describedBy: ve,
+                        "aria-describedby": ve
+                    };
                 }
-                
-                return r().createElement(b, B({
-                    "data-test": "tooltip",
-                    "data-test-open": y,
-                    "data-test-popover-id": this.popoverId,
-                    ref: i
-                }, d), g, O, E);
+                n =  (0, t.cloneElement)(o, a);
+            } else if (o) {
+                n = o;
+            } else {
+                n =  r().createElement(w, {
+                    appearance: "subtle",
+                    "aria-describedby": ve,
+                    "aria-label": (0, b._)("More info"),
+                    icon: G
+                });
             }
-        } ]);
-        return o;
-    }(n.Component);
-    X(re, "propTypes", te);
-    X(re, "defaultProps", ne);
-    var oe = (0, m.withSplunkTheme)(re);
-    oe.propTypes = re.propTypes;
-    /* harmony default export */    const ae = oe;
+            
+            return r().createElement(e, {
+                onClick: Ie,
+                onFocus: Le,
+                onBlur: _e,
+                ref: je,
+                "data-test": "toggle"
+            }, n);
+        }), [ ve, o, v, _e, Ie, Le, je, S ]);
+        var Me = S ? E : k;
+        var xe = !!s &&  r().createElement(p(), {
+            "aria-hidden": "true",
+            id: ve
+        }, s);
+        var Fe =  r().createElement(f(), {
+            role: "tooltip",
+            align: "center",
+            anchor: J,
+            animationConfig: $,
+            appearance: n,
+            closeReasons: z,
+            defaultPlacement: g,
+            id: pe,
+            open: me,
+            onRequestClose: De,
+            elementRef: we,
+            hitAreaRef: qe,
+            outerRef: Re
+        },  r().createElement(j, null, s));
+        if (N) {
+            
+            return r().createElement(r().Fragment, null, Ne(), xe, Fe);
+        }
+        
+        return r().createElement(Me, I({
+            "data-test": "tooltip",
+            "data-test-open": me,
+            "data-test-popover-id": pe,
+            ref: h
+        }, M), Be(), xe, Fe);
+    }
+    J.propTypes = U;
+    /* harmony default export */    const Q = J;
     // only for styled components using Tooltip
         // CONCATENATED MODULE: ./src/Tooltip/index.ts
-    module.exports = t;
+    module.exports = n;
     /******/})();