@splunk/react-ui 4.45.0 → 4.47.0

package/JSONTree.js

@@ -2,95 +2,175 @@
     // webpackBootstrap
     /******/ "use strict";
     /******/    var e = {
-        /***/ 4610: 
-        /***/ (e, r, n) => {
+        /***/ 8655: 
+        /***/ (e, n, r) => {
             // EXPORTS
-            n.d(r, {
-                default: () => /* reexport */ ne
+            r.d(n, {
+                default: () => /* reexport */ fe
             });
-            // UNUSED EXPORTS: TreeItem
+            // UNUSED EXPORTS: Item
             // EXTERNAL MODULE: external "react"
-                        var t = n(9497);
-            var o =  n.n(t);
+                        var t = r(9497);
+            var o =  r.n(t);
             // EXTERNAL MODULE: external "prop-types"
-                        var a = n(23);
-            var i =  n.n(a);
+                        var a = r(23);
+            var i =  r.n(a);
             // EXTERNAL MODULE: external "@splunk/ui-utils/keyboard"
-                        var l = n(5295);
+                        var l = r(5295);
             // CONCATENATED MODULE: ./src/Tree/TreeContext.tsx
             var u =  (0, t.createContext)({
                 defaultIndent: true
             });
             /* harmony default export */            const c = u;
             // EXTERNAL MODULE: external "styled-components"
-                        var f = n(232);
-            var d =  n.n(f);
+                        var f = r(232);
+            var d =  r.n(f);
             // EXTERNAL MODULE: external "@splunk/themes"
-                        var s = n(3563);
-            // CONCATENATED MODULE: ./src/Tree/TreeItemStyles.ts
+                        var s = r(3563);
+            // CONCATENATED MODULE: ./src/Tree/ItemStyles.ts
             var v = d().span.withConfig({
-                displayName: "TreeItemStyles__StyledTreeItemContent",
-                componentId: "ie7zrw-0"
-            })([ "font-family:inherit;" ]);
+                displayName: "ItemStyles__StyledTreeItemContentWrapper",
+                componentId: "sc-1ig9nmy-0"
+            })([ "display:inline-block;min-height:100%;" ]);
             var p = d().span.withConfig({
-                displayName: "TreeItemStyles__StyledTreeItemNode",
-                componentId: "ie7zrw-1"
-            })([ "&:focus{box-shadow:", ";outline:0;&:active{box-shadow:none;}}" ], s.variables.focusShadow);
+                displayName: "ItemStyles__StyledTreeItemIndent",
+                componentId: "sc-1ig9nmy-1"
+            })([ "display:inline;white-space:pre;" ]);
+            var y = d().span.withConfig({
+                displayName: "ItemStyles__StyledTreeItemContent",
+                componentId: "sc-1ig9nmy-2"
+            })([ "display:", ";min-height:100%;&:focus{outline:3px solid ", ";outline-offset:1px;&:active{outline:none;}}&:hover{background-color:", ";cursor:pointer;}" ], (function(e) {
+                var n = e.$hasCustomIndent;
+                return n ? "inline" : "inline-block";
+            }), s.variables.focusColor, (0, s.pick)({
+                dark: "rgba(255, 255, 255, 0.05)",
+                light: "rgba(0, 0, 0, 0.03)"
+            }));
             // CONCATENATED MODULE: ./src/Tree/TreeStyles.ts
-            var y = d().ul.withConfig({
+            var m = d().ul.withConfig({
                 displayName: "TreeStyles__StyledUnorderedList",
                 componentId: "sc-13pokwt-0"
             })([ "", ";font-family:inherit;list-style:none;white-space:inherit;", ";" ], s.mixins.reset("ul"), (function(e) {
-                var r = e.$defaultIndent;
-                return r && (0, f.css)([ "padding-left:", ";" ], s.variables.spacingXXXLarge);
+                var n = e.$defaultIndent;
+                return n && (0, f.css)([ "padding-left:", ";" ], s.variables.spacingXXXLarge);
             }));
-            // CONCATENATED MODULE: ./src/Tree/TreeItem.tsx
-            function m() {
-                return m = Object.assign ? Object.assign.bind() : function(e) {
-                    for (var r = 1; r < arguments.length; r++) {
-                        var n = arguments[r];
-                        for (var t in n) {
-                            ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+            // 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 b(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
+                                        }
+                }
+            }
+            // CONCATENATED MODULE: ./src/Tree/Item.tsx
+            function h(e) {
+                "@babel/helpers - typeof";
+                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;
+                }, h(e);
+            }
+            function g() {
+                return g = Object.assign ? Object.assign.bind() : function(e) {
+                    for (var n = 1; n < arguments.length; n++) {
+                        var r = arguments[n];
+                        for (var t in r) {
+                            ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
                         }
                     }
                     return e;
-                }, m.apply(null, arguments);
+                }, g.apply(null, arguments);
+            }
+            function S(e, n) {
+                var r = Object.keys(e);
+                if (Object.getOwnPropertySymbols) {
+                    var t = Object.getOwnPropertySymbols(e);
+                    n && (t = t.filter((function(n) {
+                        return Object.getOwnPropertyDescriptor(e, n).enumerable;
+                    }))), r.push.apply(r, t);
+                }
+                return r;
+            }
+            function k(e) {
+                for (var n = 1; n < arguments.length; n++) {
+                    var r = null != arguments[n] ? arguments[n] : {};
+                    n % 2 ? S(Object(r), !0).forEach((function(n) {
+                        O(e, n, r[n]);
+                    })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : S(Object(r)).forEach((function(n) {
+                        Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
+                    }));
+                }
+                return e;
+            }
+            function O(e, n, r) {
+                return (n = w(n)) in e ? Object.defineProperty(e, n, {
+                    value: r,
+                    enumerable: !0,
+                    configurable: !0,
+                    writable: !0
+                }) : e[n] = r, e;
             }
-            function b(e, r) {
-                return k(e) || w(e, r) || g(e, r) || h();
+            function w(e) {
+                var n = I(e, "string");
+                return "symbol" == h(n) ? n : n + "";
+            }
+            function I(e, n) {
+                if ("object" != h(e) || !e) return e;
+                var r = e[Symbol.toPrimitive];
+                if (void 0 !== r) {
+                    var t = r.call(e, n || "default");
+                    if ("object" != h(t)) return t;
+                    throw new TypeError("@@toPrimitive must return a primitive value.");
+                }
+                return ("string" === n ? String : Number)(e);
             }
-            function h() {
+            function x(e, n) {
+                return P(e) || T(e, n) || j(e, n) || C();
+            }
+            function C() {
                 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, r) {
+            function j(e, n) {
                 if (e) {
-                    if ("string" == typeof e) return S(e, r);
-                    var n = {}.toString.call(e).slice(8, -1);
-                    return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? S(e, r) : void 0;
+                    if ("string" == typeof e) return E(e, n);
+                    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) ? E(e, n) : void 0;
                 }
             }
-            function S(e, r) {
-                (null == r || r > e.length) && (r = e.length);
-                for (var n = 0, t = Array(r); n < r; n++) {
-                    t[n] = e[n];
+            function E(e, n) {
+                (null == n || n > e.length) && (n = e.length);
+                for (var r = 0, t = Array(n); r < n; r++) {
+                    t[r] = e[r];
                 }
                 return t;
             }
-            function w(e, r) {
-                var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-                if (null != n) {
+            function T(e, n) {
+                var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+                if (null != r) {
                     var t, o, a, i, l = [], u = !0, c = !1;
                     try {
-                        if (a = (n = n.call(e)).next, 0 === r) {
-                            if (Object(n) !== n) return;
+                        if (a = (r = r.call(e)).next, 0 === n) {
+                            if (Object(r) !== r) return;
                             u = !1;
-                        } else for (;!(u = (t = a.call(n)).done) && (l.push(t.value), l.length !== r); u = !0) {
+                        } else for (;!(u = (t = a.call(r)).done) && (l.push(t.value), l.length !== n); u = !0) {
                         }
                     } catch (e) {
                         c = !0, o = e;
                     } finally {
                         try {
-                            if (!u && null != n["return"] && (i = n["return"](), Object(i) !== i)) return;
+                            if (!u && null != r["return"] && (i = r["return"](), Object(i) !== i)) return;
                         } finally {
                             if (c) throw o;
                         }
@@ -98,172 +178,180 @@
                     return l;
                 }
             }
-            function k(e) {
+            function P(e) {
                 if (Array.isArray(e)) return e;
             }
-            function O(e, r) {
+            function A(e, n) {
                 if (null == e) return {};
-                var n, t, o = x(e, r);
+                var r, t, o = R(e, n);
                 if (Object.getOwnPropertySymbols) {
                     var a = Object.getOwnPropertySymbols(e);
                     for (t = 0; t < a.length; t++) {
-                        n = a[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
+                        r = a[t], n.includes(r) || {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
                     }
                 }
                 return o;
             }
-            function x(e, r) {
+            function R(e, n) {
                 if (null == e) return {};
-                var n = {};
+                var r = {};
                 for (var t in e) {
                     if ({}.hasOwnProperty.call(e, t)) {
-                        if (r.includes(t)) continue;
-                        n[t] = e[t];
+                        if (n.includes(t)) continue;
+                        r[t] = e[t];
                     }
                 }
-                return n;
+                return r;
             }
-            var I = {
+            var K = {
                 id: i().string,
                 children: i().node,
                 content: i().node,
                 customIndent: i().node,
+                elementRef: i().oneOfType([ i().func, i().object ]),
                 endAdornment: i().node,
-                labelledBy: i().string,
+                expanded: i().bool,
                 onFocus: i().func,
                 onKeyDown: i().func,
-                onToggle: i().func,
-                open: i().bool,
-                toggle: i().node
+                onToggleSelection: i().func,
+                onToggleExpansion: i().func
             };
-            function C(e) {
-                var r = e.id, n = e.children, a = e.content, i = e.customIndent, l = e.endAdornment, u = e.labelledBy, f = e.onFocus, d = e.onKeyDown, s = e.onToggle, h = e.open, g = h === void 0 ? true : h, S = e.toggle, w = O(e, [ "id", "children", "content", "customIndent", "endAdornment", "labelledBy", "onFocus", "onKeyDown", "onToggle", "open", "toggle" ]);
-                var k = (0, t.useContext)(c), x = k.defaultIndent, I = x === void 0 ? true : x, C = k.onItemKeyDown, j = k.onItemClick, E = k.removeNode, A = k.setNode, T = k.itemPaths, P = k.focusedItemId;
-                var R = (0, t.useState)(g), K = b(R, 2), _ = K[0], D = K[1];
+            /** @public */
+            /** @public */            function D(e) {
+                var n = e.id, r = e.children, a = e.content, i = e.customIndent, l = e.elementRef, u = e.endAdornment, f = e.expanded, d = e.onFocus, s = e.onKeyDown, h = e.onToggleExpansion, S = e.onToggleSelection, O = A(e, [ "id", "children", "content", "customIndent", "elementRef", "endAdornment", "expanded", "onFocus", "onKeyDown", "onToggleExpansion", "onToggleSelection" ]);
+                // @docs-props-type TreeItemPropsBase
+                                var w = (0, t.useContext)(c), I = w.defaultIndent, C = I === void 0 ? true : I, j = w.onItemKeyDown, E = w.onItemClick, T = w.removeNode, P = w.setNode, R = w.itemPaths, K = w.focusedItemId;
  // make first tree item tabbable
-                                var N = (0, t.useState)((T === null || T === void 0 ? void 0 : T.get("".concat(r))) === "0" ? 0 : -1), V = b(N, 2), L = V[0], q = V[1];
-                var F = (0, t.useRef)(null);
-                var M = (0, t.useRef)(null);
-                var $ = t.Children.toArray(n).filter(t.isValidElement);
-                $.forEach((function(e, n) {
+                                var D = (0, t.useState)((R === null || R === void 0 ? void 0 : R.get("".concat(n))) === "0" ? 0 : -1), _ = x(D, 2), N = _[0], V = _[1];
+                var L = (0, t.useRef)(null);
+                var q = (0, t.useRef)(null);
+                var F = t.Children.toArray(r).filter(t.isValidElement);
+                F.forEach((function(e, r) {
                     if (e.props.id) {
-                        if (_ && A) {
-                            A("".concat(e.props.id), "".concat(T === null || T === void 0 ? void 0 : T.get("".concat(r)), "-").concat(n));
-                        } else if (E) {
-                            E(e.props.id);
+                        if (f && P) {
+                            P("".concat(e.props.id), "".concat(R === null || R === void 0 ? void 0 : R.get("".concat(n)), "-").concat(r));
+                        } else if (T) {
+                            T(e.props.id);
                         }
                     }
                 }));
-                var J = function e(r, n) {
-                    D(r);
-                    s === null || s === void 0 ? void 0 : s(r, n);
-                };
-                var U = function e(n) {
-                    j === null || j === void 0 ? void 0 : j(n, r);
-                };
-                var B = function e(r) {
+                var M = (0, t.useCallback)((function(e) {
+                    b(L, e);
+                    b(l, e);
+                }), [ l ]);
+                var $ = (0, t.useCallback)((function(e) {
                     var n;
-                    r.stopPropagation();
-                    F === null || F === void 0 ? void 0 : (n = F.current) === null || n === void 0 ? void 0 : n.focus();
-                    f === null || f === void 0 ? void 0 : f(r);
-                };
-                var H = function e() {
-                    if ((T === null || T === void 0 ? void 0 : T.get("".concat(r))) === "0") {
-                        q(0);
+                    var r = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+                    // For consistency, if not provided but found in the event then add it to `data` on callback.
+                    // This allows for common handling of both click and keyboard events in the consumer.
+                                        var t = k({}, r);
+                    if (!r.treeItemId && ((n = e.currentTarget) === null || n === void 0 ? void 0 : n.id)) {
+                        t.treeItemId = e.currentTarget.id;
                     }
-                };
+                    h === null || h === void 0 ? void 0 : h(e, t);
+                }), [ h ]);
+                var J = (0, t.useCallback)((function(e) {
+                    E === null || E === void 0 ? void 0 : E(e, n);
+                }), [ n, E ]);
+                var U = (0, t.useCallback)((function(e) {
+                    var n;
+                    e.stopPropagation();
+                    q === null || q === void 0 ? void 0 : (n = q.current) === null || n === void 0 ? void 0 : n.focus();
+                    d === null || d === void 0 ? void 0 : d(e);
+                }), [ d ]);
+                var H = (0, t.useCallback)((function() {
+                    if ((R === null || R === void 0 ? void 0 : R.get("".concat(n))) === "0") {
+                        V(0);
+                    }
+                }), [ n, R ]);
                 (0, t.useEffect)((function() {
-                    if (P === r) {
+                    if (K === n) {
                         var e;
-                        M === null || M === void 0 ? void 0 : (e = M.current) === null || e === void 0 ? void 0 : e.focus();
+                        L === null || L === void 0 ? void 0 : (e = L.current) === null || e === void 0 ? void 0 : e.focus();
+                    }
+                }), [ K, n, L ]);
+                var B = (0, t.useCallback)((function(e) {
+                    e.stopPropagation();
+                }), []);
+                var X = (0, t.useCallback)((function(e) {
+                    e.stopPropagation();
+                    if (e.key === " ") {
+                        e.preventDefault();
+                        S === null || S === void 0 ? void 0 : S(e, {
+                            treeItemId: n
+                        });
+                        return;
                     }
-                }), [ P, M ]);
-                var X = function e(r) {
-                    r.stopPropagation();
-                };
-                var z = function e(n) {
-                    n.stopPropagation();
                     // Used to ensure first item in Tree is tab navigable, i.e. in JSONTree when focus is manually set to the root item,
                     // this allows user to tab backwards to previous item. Tab index is reset to 0 onBlur.
-                                        if (n.shiftKey && n.key === "Tab" && (T === null || T === void 0 ? void 0 : T.get("".concat(r))) === "0") {
-                        q(-1);
-                    }
-                    C === null || C === void 0 ? void 0 : C(n, r, _, $, J);
-                    d === null || d === void 0 ? void 0 : d(n);
-                };
-                var W = function e() {
-                    if (!S) {
-                        return undefined;
+                                        if (e.shiftKey && e.key === "Tab" && (R === null || R === void 0 ? void 0 : R.get("".concat(n))) === "0") {
+                        V(-1);
                     }
-                    
-                    return (0, t.cloneElement)(S, {
-                        onClick: function e(r) {
-                            var n, t;
-                            J(!_, r);
-                            U(r);
-                            (n = (t = S.props).onClick) === null || n === void 0 ? void 0 : n.call(t, r);
-                        },
-                        "aria-expanded": _
-                    });
-                };
+                    j === null || j === void 0 ? void 0 : j(e, n, f, F, $);
+                    s === null || s === void 0 ? void 0 : s(e);
+                }), [ F, f, $, n, R, j, s, S ]);
                 
-                return o().createElement("li", m({}, w, {
+                return o().createElement("li", g({
+                    "data-test": "tree-item"
+                }, O, {
+                    id: n,
                     ref: M,
-                    tabIndex: L,
+                    tabIndex: N,
                     onBlur: H,
-                    onFocus: B,
-                    onKeyDown: z,
+                    onFocus: U,
+                    onKeyDown: X,
                     role: "treeitem",
-                    "aria-labelledby": u,
-                    "aria-expanded": $.length ? _ : undefined
-                }), i,  o().createElement(p, {
-                    ref: F,
+                    "aria-expanded": F.length ? f || "false" : undefined
+                }),  o().createElement(v, null,  o().createElement(p, null, i),  o().createElement(y, {
+                    $hasCustomIndent: !!i,
+                    "data-test": "tree-item-content",
+                    ref: q,
                     tabIndex: -1,
-                    onFocus: X,
-                    onClick: U
-                },  o().createElement(v, null, a), W(), !_ && l), _ &&  o().createElement(o().Fragment, null,  o().createElement(y, {
+                    onFocus: B,
+                    onClick: J
+                }, a, !f && u)), f &&  o().createElement(o().Fragment, null,  o().createElement(m, {
                     role: "group",
-                    $defaultIndent: I
-                }, n), l));
+                    $defaultIndent: C
+                }, r), u));
             }
-            C.propTypes = I;
-            /* harmony default export */            const j = C;
+            D.propTypes = K;
+            /* harmony default export */            const _ = D;
             // CONCATENATED MODULE: ./src/Tree/treeUtils.ts
-            function E(e, r) {
-                return K(e) || R(e, r) || T(e, r) || A();
+            function N(e, n) {
+                return M(e) || F(e, n) || L(e, n) || V();
             }
-            function A() {
+            function V() {
                 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 T(e, r) {
+            function L(e, n) {
                 if (e) {
-                    if ("string" == typeof e) return P(e, r);
-                    var n = {}.toString.call(e).slice(8, -1);
-                    return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? P(e, r) : void 0;
+                    if ("string" == typeof e) return q(e, n);
+                    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) ? q(e, n) : void 0;
                 }
             }
-            function P(e, r) {
-                (null == r || r > e.length) && (r = e.length);
-                for (var n = 0, t = Array(r); n < r; n++) {
-                    t[n] = e[n];
+            function q(e, n) {
+                (null == n || n > e.length) && (n = e.length);
+                for (var r = 0, t = Array(n); r < n; r++) {
+                    t[r] = e[r];
                 }
                 return t;
             }
-            function R(e, r) {
-                var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-                if (null != n) {
+            function F(e, n) {
+                var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+                if (null != r) {
                     var t, o, a, i, l = [], u = !0, c = !1;
                     try {
-                        if (a = (n = n.call(e)).next, 0 === r) {
-                            if (Object(n) !== n) return;
+                        if (a = (r = r.call(e)).next, 0 === n) {
+                            if (Object(r) !== r) return;
                             u = !1;
-                        } else for (;!(u = (t = a.call(n)).done) && (l.push(t.value), l.length !== r); u = !0) {
+                        } else for (;!(u = (t = a.call(r)).done) && (l.push(t.value), l.length !== n); u = !0) {
                         }
                     } catch (e) {
                         c = !0, o = e;
                     } finally {
                         try {
-                            if (!u && null != n["return"] && (i = n["return"](), Object(i) !== i)) return;
+                            if (!u && null != r["return"] && (i = r["return"](), Object(i) !== i)) return;
                         } finally {
                             if (c) throw o;
                         }
@@ -271,189 +359,189 @@
                     return l;
                 }
             }
-            function K(e) {
+            function M(e) {
                 if (Array.isArray(e)) return e;
             }
             /**
  * A helper function to get first key in Map that matches given value
- */            function _(e, r) {
-                var n;
+ */            function $(e, n) {
+                var r;
                 var t = Array.from(e.entries());
-                return (n = t.find((function(e) {
-                    var n = E(e, 2), t = n[1];
-                    return t === r;
-                }))) === null || n === void 0 ? void 0 : n[0];
+                return (r = t.find((function(e) {
+                    var r = N(e, 2), t = r[1];
+                    return t === n;
+                }))) === null || r === void 0 ? void 0 : r[0];
             }
             /**
  * A helper function to get parent path of current item path
- */            function D(e) {
+ */            function J(e) {
                 // remove last index number of the current item path string to get parent
                 return e.split("-").slice(0, -1).join("-");
             }
             /**
  * A helper function to get next path of current item path in same level
- */            function N(e, r) {
-                return e === null || e === void 0 ? void 0 : e.replace(/([^-]*)$/, "".concat(r + 1));
+ */            function U(e, n) {
+                return e === null || e === void 0 ? void 0 : e.replace(/([^-]*)$/, "".concat(n + 1));
             }
             /**
  * A helper function to get the last index number of an item path string
- */            function V(e) {
-                var r = e.split("-").pop();
-                if (!r) {
+ */            function H(e) {
+                var n = e.split("-").pop();
+                if (!n) {
                     return 0;
                 }
-                return parseInt(r, 10) || 0;
+                return parseInt(n, 10) || 0;
             }
-            function L(e, r) {
-                var n = e.get(r);
-                if (!n) {
-                    return r;
+            function B(e, n) {
+                var r = e.get(n);
+                if (!r) {
+                    return n;
                 }
-                var t = D(n);
-                return _(e, t) || r;
+                var t = J(r);
+                return $(e, t) || n;
             }
             /**
  * A helper function for getNextTreeItem
- */            function q(e, r) {
-                var n = D(r);
-                if (!n) {
-                    return _(e, r);
+ */            function X(e, n) {
+                var r = J(n);
+                if (!r) {
+                    return $(e, n);
                 }
                 // get next node in the parent level
-                                var t = V(n);
-                var o = N(n, t);
-                var a = _(e, o);
+                                var t = H(r);
+                var o = U(r, t);
+                var a = $(e, o);
                 if (a) {
                     return a;
                 }
                 // continue getting parents until find next node or reach root
-                                return q(e, o);
+                                return X(e, o);
             }
-            function F(e, r) {
-                var n = e.get(r);
-                if (!n) {
-                    return r;
+            function W(e, n) {
+                var r = e.get(n);
+                if (!r) {
+                    return n;
                 }
                 // case where next tree item is the first visible child
-                                var t = _(e, "".concat(n, "-0"));
+                                var t = $(e, "".concat(r, "-0"));
                 if (t) {
                     return t;
                 }
                 // case where next tree item is the next node in the same level
-                                var o = V(n);
-                var a = N(n, o);
-                var i = _(e, a);
+                                var o = H(r);
+                var a = U(r, o);
+                var i = $(e, a);
                 if (i) {
                     return i;
                 }
                 // case where next tree item is a higher level or does not exist
-                                return q(e, n) || r;
+                                return X(e, r) || n;
             }
             /**
  * A helper function for getPrevTreeItem
- */            function M(e, r) {
-                var n = _(e, "".concat(r, "-0"));
-                if (!n) {
-                    return _(e, r);
+ */            function z(e, n) {
+                var r = $(e, "".concat(n, "-0"));
+                if (!r) {
+                    return $(e, n);
                 }
-                var t = _(e, r);
-                var o = "".concat(r, "-0");
+                var t = $(e, n);
+                var o = "".concat(n, "-0");
                 // get the last child in current node, and continue to find its children recursively
                                 while (t) {
-                    var a = V(o);
-                    var i = N(o, a);
-                    t = _(e, i);
+                    var a = H(o);
+                    var i = U(o, a);
+                    t = $(e, i);
                     if (t) {
                         o = i;
                     }
                 }
-                return M(e, o);
+                return z(e, o);
             }
-            function $(e, r) {
-                var n = e.get(r);
-                if (!n) {
-                    return r;
+            function G(e, n) {
+                var r = e.get(n);
+                if (!r) {
+                    return n;
                 }
-                var t = V(n);
+                var t = H(r);
                 // case where current is first child of parent or root item
                                 if (t === 0) {
-                    return L(e, r);
+                    return B(e, n);
                 }
                 // case where previous tree item is or is a child of previous node in same level
-                                var o = n.replace(/[^-]+$/, "".concat(t - 1));
-                return M(e, o) || r;
+                                var o = r.replace(/[^-]+$/, "".concat(t - 1));
+                return z(e, o) || n;
             }
-            function J(e) {
-                return _(e, "0");
+            function Q(e) {
+                return $(e, "0");
             }
-            function U(e) {
-                var r = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "0";
-                var n = _(e, r);
-                var t = r;
+            function Y(e) {
+                var n = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "0";
+                var r = $(e, n);
+                var t = n;
                 // find last child in current node
-                                while (n) {
-                    var o = V(t);
-                    n = _(e, N(t, o));
-                    if (n) {
-                        t = N(t, o);
+                                while (r) {
+                    var o = H(t);
+                    r = $(e, U(t, o));
+                    if (r) {
+                        t = U(t, o);
                     }
                 }
                 // check if last child has children
-                                var a = _(e, "".concat(t, "-0"));
+                                var a = $(e, "".concat(t, "-0"));
                 if (!a) {
-                    return _(e, t);
+                    return $(e, t);
                 }
                 // continue to find its last child recursively
                                 t = "".concat(t, "-0");
-                return U(e, t);
+                return Y(e, t);
             }
             // CONCATENATED MODULE: ./src/Tree/Tree.tsx
-            function B() {
-                return B = Object.assign ? Object.assign.bind() : function(e) {
-                    for (var r = 1; r < arguments.length; r++) {
-                        var n = arguments[r];
-                        for (var t in n) {
-                            ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+            function Z() {
+                return Z = Object.assign ? Object.assign.bind() : function(e) {
+                    for (var n = 1; n < arguments.length; n++) {
+                        var r = arguments[n];
+                        for (var t in r) {
+                            ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
                         }
                     }
                     return e;
-                }, B.apply(null, arguments);
+                }, Z.apply(null, arguments);
             }
-            function H(e, r) {
-                return Q(e) || G(e, r) || z(e, r) || X();
+            function ee(e, n) {
+                return ae(e) || oe(e, n) || re(e, n) || ne();
             }
-            function X() {
+            function ne() {
                 throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
             }
-            function z(e, r) {
+            function re(e, n) {
                 if (e) {
-                    if ("string" == typeof e) return W(e, r);
-                    var n = {}.toString.call(e).slice(8, -1);
-                    return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? W(e, r) : void 0;
+                    if ("string" == typeof e) return te(e, n);
+                    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) ? te(e, n) : void 0;
                 }
             }
-            function W(e, r) {
-                (null == r || r > e.length) && (r = e.length);
-                for (var n = 0, t = Array(r); n < r; n++) {
-                    t[n] = e[n];
+            function te(e, n) {
+                (null == n || n > e.length) && (n = e.length);
+                for (var r = 0, t = Array(n); r < n; r++) {
+                    t[r] = e[r];
                 }
                 return t;
             }
-            function G(e, r) {
-                var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-                if (null != n) {
+            function oe(e, n) {
+                var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+                if (null != r) {
                     var t, o, a, i, l = [], u = !0, c = !1;
                     try {
-                        if (a = (n = n.call(e)).next, 0 === r) {
-                            if (Object(n) !== n) return;
+                        if (a = (r = r.call(e)).next, 0 === n) {
+                            if (Object(r) !== r) return;
                             u = !1;
-                        } else for (;!(u = (t = a.call(n)).done) && (l.push(t.value), l.length !== r); u = !0) {
+                        } else for (;!(u = (t = a.call(r)).done) && (l.push(t.value), l.length !== n); u = !0) {
                         }
                     } catch (e) {
                         c = !0, o = e;
                     } finally {
                         try {
-                            if (!u && null != n["return"] && (i = n["return"](), Object(i) !== i)) return;
+                            if (!u && null != r["return"] && (i = r["return"](), Object(i) !== i)) return;
                         } finally {
                             if (c) throw o;
                         }
@@ -461,129 +549,141 @@
                     return l;
                 }
             }
-            function Q(e) {
+            function ae(e) {
                 if (Array.isArray(e)) return e;
             }
-            function Y(e, r) {
+            function ie(e, n) {
                 if (null == e) return {};
-                var n, t, o = Z(e, r);
+                var r, t, o = le(e, n);
                 if (Object.getOwnPropertySymbols) {
                     var a = Object.getOwnPropertySymbols(e);
                     for (t = 0; t < a.length; t++) {
-                        n = a[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
+                        r = a[t], n.includes(r) || {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
                     }
                 }
                 return o;
             }
-            function Z(e, r) {
+            function le(e, n) {
                 if (null == e) return {};
-                var n = {};
+                var r = {};
                 for (var t in e) {
                     if ({}.hasOwnProperty.call(e, t)) {
-                        if (r.includes(t)) continue;
-                        n[t] = e[t];
+                        if (n.includes(t)) continue;
+                        r[t] = e[t];
                     }
                 }
-                return n;
+                return r;
             }
-            var ee = {
+            var ue = {
                 children: i().node,
-                defaultIndent: i().bool
+                defaultIndent: i().bool,
+                elementRef: i().oneOfType([ i().func, i().object ])
             };
-            function re(e) {
-                var r = e.children, n = e.defaultIndent, a = n === void 0 ? true : n, i = Y(e, [ "children", "defaultIndent" ]);
-                var u = (0, t.useState)(), f = H(u, 2), d = f[0], s = f[1];
-                var v = new Map;
-                var p = function e(r, n, t, o, a) {
-                    r.stopPropagation();
-                    var i = (0, l.keycode)(r.nativeEvent);
+            /**
+ * Used to present a hierarchical list.
+ */            function ce(e) {
+                var n = e.children, r = e.defaultIndent, a = r === void 0 ? true : r, i = e.elementRef, u = ie(e, [ "children", "defaultIndent", "elementRef" ]);
+                // @docs-props-type TreePropsBase
+                                var f = (0, t.useState)(), d = ee(f, 2), s = d[0], v = d[1];
+                var p = new Map;
+                var y = function e(n, r, t, o, a) {
+                    n.stopPropagation();
+                    var i = (0, l.keycode)(n.nativeEvent);
                     var u = t && (o === null || o === void 0 ? void 0 : o.length);
                     switch (i) {
                       case "up":
-                        r.preventDefault();
-                        s($(v, n));
+                        n.preventDefault();
+                        v(G(p, r));
                         break;
 
                       case "down":
-                        r.preventDefault();
-                        s(F(v, n));
+                        n.preventDefault();
+                        v(W(p, r));
                         break;
 
                       case "left":
-                        r.preventDefault();
+                        n.preventDefault();
                         if (u) {
-                            a(false, r);
+                            a(n, {
+                                treeItemId: r
+                            });
                         } else {
-                            s(L(v, n));
+                            v(B(p, r));
                         }
                         break;
 
                       case "right":
-                        r.preventDefault();
+                        n.preventDefault();
                         if (u) {
-                            s(F(v, n));
+                            v(W(p, r));
                         } else {
-                            a(true, r);
+                            a(n, {
+                                treeItemId: r
+                            });
                         }
                         break;
 
                       case "home":
-                        r.preventDefault();
-                        s(J(v));
+                        n.preventDefault();
+                        v(Q(p));
                         break;
 
                       case "end":
-                        r.preventDefault();
-                        s(U(v));
+                        n.preventDefault();
+                        v(Y(p));
                         break;
 
                       case "enter":
-                        r.preventDefault();
-                        a(!u, r);
+                        n.preventDefault();
+                        a(n, {
+                            treeItemId: r
+                        });
                         break;
 
                       default:
  // do nothing
                                         }
                 };
-                var m = function e(r, n) {
-                    r.preventDefault();
-                    s(n);
+                var b = function e(n, r) {
+                    n.preventDefault();
+                    v(r);
                 };
-                var b = function e(r) {
-                    v["delete"](r);
+                var h = function e(n) {
+                    p["delete"](n);
                 };
-                var h = function e(r, n) {
-                    v.set(r, n);
+                var g = function e(n, r) {
+                    p.set(n, r);
                 };
-                var g = t.Children.toArray(r).filter(t.isValidElement);
-                g.forEach((function(e, r) {
-                    if (e.props.id && h) {
-                        h("".concat(e.props.id), "".concat(r));
+                var S = t.Children.toArray(n).filter(t.isValidElement);
+                S.forEach((function(e, n) {
+                    if (e.props.id && g) {
+                        g("".concat(e.props.id), "".concat(n));
                     }
                 }));
-                var S = (0, t.useMemo)((function() {
+                var k = (0, t.useMemo)((function() {
                     return {
                         defaultIndent: a,
-                        onItemKeyDown: p,
-                        onItemClick: m,
-                        removeNode: b,
-                        setNode: h,
-                        itemPaths: v,
-                        focusedItemId: d
+                        onItemKeyDown: y,
+                        onItemClick: b,
+                        removeNode: h,
+                        setNode: g,
+                        itemPaths: p,
+                        focusedItemId: s
                     };
-                }), [ a, d, v, p, b, h ]);
+                }), [ a, s, p, y, h, g ]);
                 
                 return o().createElement(c.Provider, {
-                    value: S
-                },  o().createElement(y, B({
+                    value: k
+                },  o().createElement(m, Z({
+                    "data-test": "tree",
+                    ref: i,
                     role: "tree",
                     $defaultIndent: a
-                }, i), r));
+                }, u), n));
             }
-            re.propTypes = ee;
-            re.TreeItem = j;
-            /* harmony default export */            const ne = re;
+            ce.propTypes = ue;
+            ce.Item = _;
+            /* harmony default export */            const fe = ce;
         } // CONCATENATED MODULE: ./src/Tree/index.ts
         /***/ ,
         /***/ 3563: 
@@ -610,24 +710,24 @@
     };
     /************************************************************************/
     /******/ // The module cache
-    /******/    var r = {};
+    /******/    var n = {};
     /******/
     /******/ // The require function
-    /******/    function n(t) {
+    /******/    function r(t) {
         /******/ // Check if module is in cache
-        /******/ var o = r[t];
+        /******/ var o = n[t];
         /******/        if (o !== undefined) {
             /******/ return o.exports;
             /******/        }
         /******/ // Create a new module (and put it into the cache)
-        /******/        var a = r[t] = {
+        /******/        var a = n[t] = {
             /******/ // no module.id needed
             /******/ // no module.loaded needed
             /******/ exports: {}
             /******/        };
         /******/
         /******/ // Execute the module function
-        /******/        e[t](a, a.exports, n);
+        /******/        e[t](a, a.exports, r);
         /******/
         /******/ // Return the exports of the module
         /******/        return a.exports;
@@ -637,27 +737,27 @@
     /******/ /* webpack/runtime/compat get default export */
     /******/    (() => {
         /******/ // getDefaultExport function for compatibility with non-harmony modules
-        /******/ n.n = e => {
-            /******/ var r = e && e.__esModule ? 
+        /******/ r.n = e => {
+            /******/ var n = e && e.__esModule ? 
             /******/ () => e["default"]
             /******/ : () => e
             /******/;
-            n.d(r, {
-                a: r
+            r.d(n, {
+                a: n
             });
-            /******/            return r;
+            /******/            return n;
             /******/        };
         /******/    })();
     /******/
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ n.d = (e, r) => {
-            /******/ for (var t in r) {
-                /******/ if (n.o(r, t) && !n.o(e, t)) {
+        /******/ r.d = (e, n) => {
+            /******/ for (var t in n) {
+                /******/ if (r.o(n, t) && !r.o(e, t)) {
                     /******/ Object.defineProperty(e, t, {
                         enumerable: true,
-                        get: r[t]
+                        get: n[t]
                     });
                     /******/                }
                 /******/            }
@@ -666,14 +766,14 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ n.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
+        /******/ r.o = (e, n) => Object.prototype.hasOwnProperty.call(e, n)
         /******/;
     })();
     /******/
     /******/ /* webpack/runtime/make namespace object */
     /******/    (() => {
         /******/ // define __esModule on exports
-        /******/ n.r = e => {
+        /******/ r.r = e => {
             /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
                 /******/ Object.defineProperty(e, Symbol.toStringTag, {
                     value: "Module"
@@ -689,25 +789,25 @@
     // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
         (() => {
         // ESM COMPAT FLAG
-        n.r(t);
+        r.r(t);
         // EXPORTS
-                n.d(t, {
-            default: () => /* reexport */ xe
+                r.d(t, {
+            default: () => /* reexport */ Ie
         });
         // EXTERNAL MODULE: external "react"
-                var e = n(9497);
-        var r =  n.n(e);
+                var e = r(9497);
+        var n =  r.n(e);
         // EXTERNAL MODULE: external "prop-types"
-                var o = n(23);
-        var a =  n.n(o);
+                var o = r(23);
+        var a =  r.n(o);
         // CONCATENATED MODULE: external "lodash/isString"
         const i = require("lodash/isString");
-        var l =  n.n(i);
+        var l =  r.n(i);
         // EXTERNAL MODULE: external "styled-components"
-                var u = n(232);
-        var c =  n.n(u);
+                var u = r(232);
+        var c =  r.n(u);
         // EXTERNAL MODULE: external "@splunk/themes"
-                var f = n(3563);
+                var f = r(3563);
         // CONCATENATED MODULE: ./src/JSONTree/JSONTreeStyles.ts
         var d = (0, u.css)([ "", ";", ";" ], f.mixins.reset("block"), f.mixins.typography({
             family: "monospace"
@@ -722,78 +822,78 @@
         })([ "", ";white-space:pre-wrap;" ], d);
         // CONCATENATED MODULE: external "lodash/fill"
         const p = require("lodash/fill");
-        var y =  n.n(p);
+        var y =  r.n(p);
         // CONCATENATED MODULE: external "lodash/isArray"
         const m = require("lodash/isArray");
-        var b =  n.n(m);
+        var b =  r.n(m);
         // CONCATENATED MODULE: external "lodash/isEmpty"
         const h = require("lodash/isEmpty");
-        var g =  n.n(h);
+        var g =  r.n(h);
         // CONCATENATED MODULE: external "lodash/isNumber"
         const S = require("lodash/isNumber");
-        var w =  n.n(S);
+        var k =  r.n(S);
         // CONCATENATED MODULE: external "lodash/isObject"
-        const k = require("lodash/isObject");
-        var O =  n.n(k);
+        const O = require("lodash/isObject");
+        var w =  r.n(O);
         // CONCATENATED MODULE: external "lodash/keys"
-        const x = require("lodash/keys");
-        var I =  n.n(x);
+        const I = require("lodash/keys");
+        var x =  r.n(I);
         // CONCATENATED MODULE: external "lodash/repeat"
         const C = require("lodash/repeat");
-        var j =  n.n(C);
+        var j =  r.n(C);
         // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
         const E = require("@splunk/ui-utils/i18n");
         // EXTERNAL MODULE: external "@splunk/ui-utils/keyboard"
-                var A = n(5295);
-        // EXTERNAL MODULE: ./src/Tree/index.ts + 6 modules
-                var T = n(4610);
+                var T = r(5295);
+        // EXTERNAL MODULE: ./src/Tree/index.ts + 7 modules
+                var P = r(8655);
         // CONCATENATED MODULE: ./src/JSONTree/JSONTreeItem.tsx
-        function P() {
-            return P = Object.assign ? Object.assign.bind() : function(e) {
-                for (var r = 1; r < arguments.length; r++) {
-                    var n = arguments[r];
-                    for (var t in n) {
-                        ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+        function A() {
+            return A = Object.assign ? Object.assign.bind() : function(e) {
+                for (var n = 1; n < arguments.length; n++) {
+                    var r = arguments[n];
+                    for (var t in r) {
+                        ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
                     }
                 }
                 return e;
-            }, P.apply(null, arguments);
+            }, A.apply(null, arguments);
         }
-        function R(e, r) {
-            return V(e) || N(e, r) || _(e, r) || K();
+        function R(e, n) {
+            return V(e) || N(e, n) || D(e, n) || K();
         }
         function K() {
             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 _(e, r) {
+        function D(e, n) {
             if (e) {
-                if ("string" == typeof e) return D(e, r);
-                var n = {}.toString.call(e).slice(8, -1);
-                return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? D(e, r) : void 0;
+                if ("string" == typeof e) return _(e, n);
+                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) ? _(e, n) : void 0;
             }
         }
-        function D(e, r) {
-            (null == r || r > e.length) && (r = e.length);
-            for (var n = 0, t = Array(r); n < r; n++) {
-                t[n] = e[n];
+        function _(e, n) {
+            (null == n || n > e.length) && (n = e.length);
+            for (var r = 0, t = Array(n); r < n; r++) {
+                t[r] = e[r];
             }
             return t;
         }
-        function N(e, r) {
-            var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-            if (null != n) {
+        function N(e, n) {
+            var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+            if (null != r) {
                 var t, o, a, i, l = [], u = !0, c = !1;
                 try {
-                    if (a = (n = n.call(e)).next, 0 === r) {
-                        if (Object(n) !== n) return;
+                    if (a = (r = r.call(e)).next, 0 === n) {
+                        if (Object(r) !== r) return;
                         u = !1;
-                    } else for (;!(u = (t = a.call(n)).done) && (l.push(t.value), l.length !== r); u = !0) {
+                    } else for (;!(u = (t = a.call(r)).done) && (l.push(t.value), l.length !== n); u = !0) {
                     }
                 } catch (e) {
                     c = !0, o = e;
                 } finally {
                     try {
-                        if (!u && null != n["return"] && (i = n["return"](), Object(i) !== i)) return;
+                        if (!u && null != r["return"] && (i = r["return"](), Object(i) !== i)) return;
                     } finally {
                         if (c) throw o;
                     }
@@ -804,27 +904,27 @@
         function V(e) {
             if (Array.isArray(e)) return e;
         }
-        function L(e, r) {
+        function L(e, n) {
             if (null == e) return {};
-            var n, t, o = q(e, r);
+            var r, t, o = q(e, n);
             if (Object.getOwnPropertySymbols) {
                 var a = Object.getOwnPropertySymbols(e);
                 for (t = 0; t < a.length; t++) {
-                    n = a[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
+                    r = a[t], n.includes(r) || {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
                 }
             }
             return o;
         }
-        function q(e, r) {
+        function q(e, n) {
             if (null == e) return {};
-            var n = {};
+            var r = {};
             for (var t in e) {
                 if ({}.hasOwnProperty.call(e, t)) {
-                    if (r.includes(t)) continue;
-                    n[t] = e[t];
+                    if (n.includes(t)) continue;
+                    r[t] = e[t];
                 }
             }
-            return n;
+            return r;
         }
         var F = {
             clickableKeyRef: a().object,
@@ -840,37 +940,41 @@
             representation: a().node,
             value: a().oneOfType([ a().string, a().object, a().array, a().number, a().bool ])
         };
-        function M(n) {
-            var t = n.clickableKeyRef, o = n.clickableValRef, a = n.hasChildren, i = n.indentArray, l = n.index, u = n.initialOpenState, c = n.onFocus, f = n.properties, d = n.propertyDataPath, s = n.propertyElement, v = n.renderExpandLink, p = n.representation, y = n.value, m = L(n, [ "clickableKeyRef", "clickableValRef", "hasChildren", "indentArray", "index", "initialOpenState", "onFocus", "properties", "propertyDataPath", "propertyElement", "renderExpandLink", "representation", "value" ]);
-            var h = (0, e.useState)(u), g = R(h, 2), S = g[0], w = g[1];
-            var k = function e(r) {
-                w(r);
-            };
-            var O = (0, e.useRef)(null);
-            var x = v ? v({
+        function M(r) {
+            var t = r.clickableKeyRef, o = r.clickableValRef, a = r.hasChildren, i = r.indentArray, l = r.index, u = r.initialOpenState, c = r.onFocus, f = r.properties, d = r.propertyDataPath, s = r.propertyElement, v = r.renderExpandLink, p = r.representation, y = r.value, m = L(r, [ "clickableKeyRef", "clickableValRef", "hasChildren", "indentArray", "index", "initialOpenState", "onFocus", "properties", "propertyDataPath", "propertyElement", "renderExpandLink", "representation", "value" ]);
+            var h = (0, e.useState)(u), g = R(h, 2), S = g[0], k = g[1];
+            var O = (0, e.useCallback)((function() {
+                k((function(e) {
+                    return !e;
+                }));
+            }), []);
+            var w = (0, e.useRef)(null);
+            var I = v ? v({
+                onToggleExpansion: O,
                 open: S,
                 withTooltip: true,
-                expandLinkRef: O
+                expandLinkRef: w
             }) : {
                 expandLink: undefined
-            }, I = x.expandLink;
+            }, x = I.expandLink;
             var C = (f === null || f === void 0 ? void 0 : f.length) && l + 1 < (f === null || f === void 0 ? void 0 : f.length) ? "," : null;
             
-            return r().createElement(T["default"].TreeItem, P({
-                content:  r().createElement(r().Fragment, null, s, a && (b()(y) ? "[" : "{"), !a &&  r().createElement(r().Fragment, null, p, C)),
+            return n().createElement(P["default"].Item, A({
+                content:  n().createElement(n().Fragment, null, s, a && (b()(y) ? "[" : "{"), !a &&  n().createElement(n().Fragment, null, p, C), a && x),
                 customIndent: i,
                 "data-test": a ? "node" : null,
                 "data-test-path": d,
-                endAdornment: a &&  r().createElement(r().Fragment, null, S && i, b()(y) ? "]" : "}", C),
-                onFocus: function e(r) {
-                    c === null || c === void 0 ? void 0 : c(r);
+                endAdornment: a &&  n().createElement(n().Fragment, null, S && i, b()(y) ? "]" : "}", C),
+                expanded: S,
+                onFocus: function e(n) {
+                    c === null || c === void 0 ? void 0 : c(n);
                     // check if onFocus was triggered by a click event or expand link
-                                        var n = r.relatedTarget === (t === null || t === void 0 ? void 0 : t.current) || r.relatedTarget === (o === null || o === void 0 ? void 0 : o.current) || r.relatedTarget === (O === null || O === void 0 ? void 0 : O.current) ? r.relatedTarget : null;
+                                        var r = n.relatedTarget === (t === null || t === void 0 ? void 0 : t.current) || n.relatedTarget === (o === null || o === void 0 ? void 0 : o.current) || n.relatedTarget === (w === null || w === void 0 ? void 0 : w.current) ? n.relatedTarget : null;
                     if (m.id === "root") {
                         var a;
-                        O === null || O === void 0 ? void 0 : (a = O.current) === null || a === void 0 ? void 0 : a.focus();
+                        w === null || w === void 0 ? void 0 : (a = w.current) === null || a === void 0 ? void 0 : a.focus();
                     }
-                    if (!n) {
+                    if (!r) {
                         // if JSONTreeItem contains clickable keys/vals, focus should go there
                         if (s && (t === null || t === void 0 ? void 0 : t.current)) {
                             var i;
@@ -880,24 +984,22 @@
                             (l = o.current) === null || l === void 0 ? void 0 : l.focus();
                         }
                     } else {
-                        n.focus();
+                        r.focus();
                     }
                 },
-                onToggle: k,
-                open: u,
-                tabIndex: 0,
-                toggle: a ? I : undefined
+                onToggleExpansion: O,
+                tabIndex: 0
             }, m), a && p);
         }
         M.propTypes = F;
         // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
         const $ = require("@splunk/react-ui/Clickable");
-        var J =  n.n($);
+        var J =  r.n($);
         // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
         const U = require("@splunk/react-ui/Tooltip");
-        var B =  n.n(U);
+        var H =  r.n(U);
         // CONCATENATED MODULE: ./src/JSONTree/JSONTreeItemStyles.ts
-        var H = {
+        var B = {
             string: f.variables.syntaxTeal,
             number: f.variables.syntaxBlue,
             boolean: f.variables.syntaxPurple,
@@ -905,22 +1007,22 @@
             object: f.variables.contentColorDefault
         };
         var X = (0, u.css)([ "word-break:break-word;word-wrap:break-word;" ]);
-        var z = (0, u.css)([ "white-space:nowrap;" ]);
-        var W = (0, u.css)([ "color:", ";", ";" ], (function(e) {
-            var r = e.valueType;
-            return H[r];
+        var W = (0, u.css)([ "white-space:nowrap;" ]);
+        var z = (0, u.css)([ "color:", ";", ";" ], (function(e) {
+            var n = e.valueType;
+            return B[n];
         }), (function(e) {
-            var r = e.overflowType;
-            return r === "wrap" ? X : z;
+            var n = e.overflowType;
+            return n === "wrap" ? X : W;
         }));
         var G = c().span.withConfig({
             displayName: "JSONTreeItemStyles__StyledValue",
             componentId: "o558h3-0"
-        })([ "", "" ], W);
+        })([ "", "" ], z);
         var Q = c()(J()).withConfig({
             displayName: "JSONTreeItemStyles__StyledValueInteractiveClickable",
             componentId: "o558h3-1"
-        })([ "", " font-family:inherit;&:focus{box-shadow:0 0 1px 3px ", ";outline:0;&:active{box-shadow:none;}}&:hover{background-color:", ";}" ], W, f.variables.focusColor, (0, 
+        })([ "", " font-family:inherit;&:focus{box-shadow:0 0 1px 3px ", ";outline:0;&:active{box-shadow:none;}}&:hover{background-color:", ";}" ], z, f.variables.focusColor, (0, 
         f.pick)({
             enterprise: f.variables.backgroundColorHover,
             prisma: f.variables.interactiveColorOverlayHover
@@ -944,7 +1046,7 @@
             enterprise: f.variables.backgroundColorHover,
             prisma: f.variables.interactiveColorOverlayHover
         }));
-        var re = c()(J()).withConfig({
+        var ne = c()(J()).withConfig({
             displayName: "JSONTreeItemStyles__StyledExpandLinkClickable",
             componentId: "o558h3-4"
         })([ "cursor:pointer;color:", ";font-family:inherit;&:hover{background-color:", ";text-decoration:none;}&:focus{box-shadow:", ";&:active{box-shadow:none;}}", "" ], (0, 
@@ -960,7 +1062,7 @@
         }), f.variables.focusShadowInset, (0, f.pick)({
             prisma: (0, u.css)([ "border-radius:", ";" ], f.variables.borderRadius)
         }));
-        var ne = c()(B()).withConfig({
+        var re = c()(H()).withConfig({
             displayName: "JSONTreeItemStyles__StyledTooltip",
             componentId: "o558h3-5"
         })([ "font-family:", ";" ], f.variables.monoFontFamily);
@@ -979,11 +1081,11 @@
         function ae() {
             throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
         }
-        function ie(e, r) {
+        function ie(e, n) {
             if (e) {
-                if ("string" == typeof e) return ce(e, r);
-                var n = {}.toString.call(e).slice(8, -1);
-                return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? ce(e, r) : void 0;
+                if ("string" == typeof e) return ce(e, n);
+                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) ? ce(e, n) : void 0;
             }
         }
         function le(e) {
@@ -992,67 +1094,67 @@
         function ue(e) {
             if (Array.isArray(e)) return ce(e);
         }
-        function ce(e, r) {
-            (null == r || r > e.length) && (r = e.length);
-            for (var n = 0, t = Array(r); n < r; n++) {
-                t[n] = e[n];
+        function ce(e, n) {
+            (null == n || n > e.length) && (n = e.length);
+            for (var r = 0, t = Array(n); r < n; r++) {
+                t[r] = e[r];
             }
             return t;
         }
-        function fe(n) {
-            var t = n.id, o = n.childKey, a = n.index, i = n.value, l = n.properties, u = n.propertyDataPath, c = n.obj, f = n.renderValue, d = n.renderKey, s = n.getInitialOpenState, v = n.indentArray, p = n.renderExpandLink, y = n.onFocus;
+        function fe(r) {
+            var t = r.id, o = r.childKey, a = r.index, i = r.value, l = r.properties, u = r.propertyDataPath, c = r.obj, f = r.renderValue, d = r.renderKey, s = r.getInitialOpenState, v = r.indentArray, p = r.renderExpandLink, y = r.onFocus;
             var m = (0, e.useRef)(null);
             var h = (0, e.useRef)(null);
             var S = f({
                 key: o,
                 value: i,
                 clickValueRef: m
-            }), w = S.representation, k = S.clickableValRef;
-            var x = !b()(c) ? d(o, h) : {
+            }), k = S.representation, O = S.clickableValRef;
+            var I = !b()(c) ? d(o, h) : {
                 propertyElement: undefined,
                 clickableKeyRef: undefined
-            }, I = x.propertyElement, C = x.clickableKeyRef;
-            var j = O()(i) && !g()(i) || b()(i) && i.length > 0;
+            }, x = I.propertyElement, C = I.clickableKeyRef;
+            var j = w()(i) && !g()(i) || b()(i) && i.length > 0;
             
-            return r().createElement(M, {
+            return n().createElement(M, {
                 id: t,
                 propertyDataPath: u,
-                propertyElement: I,
+                propertyElement: x,
                 hasChildren: j,
                 initialOpenState: s(),
-                representation: w,
+                representation: k,
                 indentArray: v,
                 value: i,
                 index: a,
                 properties: l,
                 renderExpandLink: p,
                 clickableKeyRef: C,
-                clickableValRef: k,
+                clickableValRef: O,
                 onFocus: function e() {
-                    y(C, k);
+                    y(C, O);
                 }
             });
         }
-        function de(n) {
-            var t = n.renderValue, o = n.obj;
+        function de(r) {
+            var t = r.renderValue, o = r.obj;
             var a = (0, e.useRef)(null);
             var i = t({
                 value: o,
                 clickValueRef: a
             }), l = i.representation;
             
-            return r().createElement(T["default"].TreeItem, {
+            return n().createElement(P["default"].Item, {
                 id: "0",
                 "data-test-path": ".",
                 content: l
             });
         }
         function se(e) {
-            var n = e.defaultOpen, t = n === void 0 ? false : n, o = e.expandChildren, a = o === void 0 ? false : o, i = e.expandChildrenOnShiftKey, u = i === void 0 ? false : i, c = e.indent, f = c === void 0 ? 4 : c, d = e.indentLevel, s = d === void 0 ? 1 : d, v = e.obj, p = e.onClickKey, m = e.onClickValue, h = e.overflow, S = h === void 0 ? "scroll" : h, k = e.path, x = k === void 0 ? [] : k, C = e.shift, T = e.updateShift;
-            var P = y()(Array(s), j()(" ", f));
+            var r = e.defaultOpen, t = r === void 0 ? false : r, o = e.expandChildren, a = o === void 0 ? false : o, i = e.expandChildrenOnShiftKey, u = i === void 0 ? false : i, c = e.indent, f = c === void 0 ? 4 : c, d = e.indentLevel, s = d === void 0 ? 1 : d, v = e.obj, p = e.onClickKey, m = e.onClickValue, h = e.overflow, S = h === void 0 ? "scroll" : h, O = e.path, I = O === void 0 ? [] : O, C = e.shift, P = e.updateShift;
+            var A = y()(Array(s), j()(" ", f));
             var R;
             var K;
-            var _ = function e() {
+            var D = function e() {
                 if (a === true) {
                     return t;
                 }
@@ -1061,83 +1163,84 @@
                 }
                 return false;
             };
-            var D = function e(r) {
+            var _ = function e(n) {
                 if (a === "withShiftModifier" || u) {
-                    if (T != null) {
-                        T(r.shiftKey);
+                    if (P != null) {
+                        P(n.shiftKey);
                     }
                 }
             };
-            var N = function e(r, n) {
+            var N = function e(n, r) {
                 var t, o;
                 // When rendering a single value key is not present, here we prevent `[undefined]` in path
-                                var a = n !== undefined ? [].concat(oe(x), [ n ]) : oe(x);
+                                var a = r !== undefined ? [].concat(oe(I), [ r ]) : oe(I);
                 var i = ".".concat(a.join("."));
                 (t = K) === null || t === void 0 ? void 0 : (o = t.current) === null || o === void 0 ? void 0 : o.focus();
-                p === null || p === void 0 ? void 0 : p(r, {
+                p === null || p === void 0 ? void 0 : p(n, {
                     key: i,
                     keyPath: a
                 });
             };
-            var V = function e(r, n) {
+            var V = function e(n, r) {
                 var t, o;
                 // When rendering a single value key is not present, here we prevent `[undefined]` in path
-                                var a = n !== undefined ? [].concat(oe(x), [ n ]) : oe(x);
+                                var a = r !== undefined ? [].concat(oe(I), [ r ]) : oe(I);
                 var i = ".".concat(a.join("."));
                 (t = R) === null || t === void 0 ? void 0 : (o = t.current) === null || o === void 0 ? void 0 : o.focus();
-                m === null || m === void 0 ? void 0 : m(r, {
+                m === null || m === void 0 ? void 0 : m(n, {
                     key: i,
                     keyPath: a,
-                    value: r.target.textContent
+                    value: n.target.textContent
                 });
             };
-            var L = function e(r, n) {
+            var L = function e(n, r) {
                 var t, o;
-                var a = (0, A.keycode)(r.nativeEvent);
-                if (a === "left" && p && ((t = K) === null || t === void 0 ? void 0 : t.current) && !n) {
+                var a = (0, T.keycode)(n.nativeEvent);
+                if (a === "left" && p && ((t = K) === null || t === void 0 ? void 0 : t.current) && !r) {
                     var i;
-                    r.stopPropagation();
+                    n.stopPropagation();
                     (i = K.current) === null || i === void 0 ? void 0 : i.focus();
                 }
-                if (a === "right" && m && ((o = R) === null || o === void 0 ? void 0 : o.current) && n) {
+                if (a === "right" && m && ((o = R) === null || o === void 0 ? void 0 : o.current) && r) {
                     var l;
-                    r.stopPropagation();
+                    n.stopPropagation();
                     (l = R.current) === null || l === void 0 ? void 0 : l.focus();
                 }
             };
-            var q = function e(n) {
-                var t = n.open, o = n.withTooltip, a = n.expandLinkRef;
-                var i = t ? "[-]" : "[+]";
-                var l = t ? (0, E._)("Collapse all") : (0, E._)("Shift click to expand all");
-                var c =  r().createElement(re, {
-                    elementRef: a,
+            var q = function e(r) {
+                var t = r.onToggleExpansion, o = r.open, a = r.withTooltip, i = r.expandLinkRef;
+                var l = o ? "[-]" : "[+]";
+                var c = o ? (0, E._)("Collapse all") : (0, E._)("Shift click to expand all");
+                var f =  n().createElement(ne, {
+                    elementRef: i,
                     tabIndex: -1,
-                    onClick: function e(r) {
-                        D(r);
+                    onClick: function e(n) {
+                        _(n);
+                        t === null || t === void 0 ? void 0 : t(n);
                     },
-                    "aria-expanded": t,
+                    "aria-expanded": o,
                     "data-test": "toggle"
-                }, " ", i, " ");
-                if (u && o) {
+                }, " ", l, " ");
+                if (u && a) {
                     return {
-                        expandLink:  r().createElement(ne, {
+                        expandLink:  n().createElement(re, {
                             contentRelationship: "description",
                             openDelay: "secondary",
                             defaultPlacement: "above",
-                            content: (0, E._)(l)
-                        }, c),
-                        expandLinkRef: a
+                            content: (0, E._)(c)
+                        }, f),
+                        expandLinkRef: i
                     };
                 }
                 return {
-                    expandLink: c,
-                    expandLinkRef: a
+                    expandLink: f,
+                    expandLinkRef: i
                 };
             };
-            var F = function e(n) {
-                var t = n.value, o = n.key, i = n.clickValueRef;
+            var F = function e(r) {
+                var t = r.value, o = r.key, i = r.clickValueRef;
                 var c;
-                if (!O()(t)) {
+                if (!w()(t)) {
                     if (typeof t === "string") {
                         c = '"'.concat(t, '"');
                     } else if (typeof t === "boolean") {
@@ -1159,27 +1262,27 @@
                         onClickValue: m,
                         overflow: S,
                         obj: t,
-                        path: o !== undefined ? [].concat(oe(x), [ o ]) : oe(x),
+                        path: o !== undefined ? [].concat(oe(I), [ o ]) : oe(I),
                         indentLevel: s + 1,
                         shift: C,
-                        updateShift: T
+                        updateShift: P
                     });
                 }
-                if (l()(c) || w()(c)) {
+                if (l()(c) || k()(c)) {
                     var f = t === null ? "null" : // TS: bigint, function, symbol are prevented by JSONElement type
                     te(t);
                     if (m) {
                         return {
-                            representation:  r().createElement(Q, {
+                            representation:  n().createElement(Q, {
                                 elementRef: i,
                                 valueType: f,
                                 overflowType: S,
-                                onClick: function e(r) {
+                                onClick: function e(n) {
                                     R = i;
-                                    V(r, o);
+                                    V(n, o);
                                 },
-                                onKeyDown: function e(r) {
-                                    L(r, false);
+                                onKeyDown: function e(n) {
+                                    L(n, false);
                                 },
                                 tabIndex: -1
                             }, c),
@@ -1187,7 +1290,7 @@
                         };
                     }
                     return {
-                        representation:  r().createElement(G, {
+                        representation:  n().createElement(G, {
                             valueType: f,
                             overflowType: S
                         }, c)
@@ -1197,58 +1300,58 @@
                     representation: c
                 };
             };
-            var $ = function e(n, t) {
+            var $ = function e(r, t) {
                 if (p) {
                     return {
-                        propertyElement:  r().createElement("span", null,  r().createElement(ee, {
+                        propertyElement:  n().createElement("span", null,  n().createElement(ee, {
                             elementRef: t,
                             tabIndex: -1,
-                            onClick: function e(r) {
+                            onClick: function e(n) {
                                 K = t;
-                                N(r, n);
+                                N(n, r);
                             },
-                            onKeyDown: function e(r) {
-                                L(r, true);
+                            onKeyDown: function e(n) {
+                                L(n, true);
                             }
-                        }, n), ":", " "),
+                        }, r), ":", " "),
                         clickableKeyRef: t
                     };
                 }
                 return {
-                    propertyElement:  r().createElement("span", null,  r().createElement(Z, null, n), ":", " ")
+                    propertyElement:  n().createElement("span", null,  n().createElement(Z, null, r), ":", " ")
                 };
             };
-            if (O()(v) && !g()(v) || b()(v) && v.length > 0) {
-                var J = I()(v).map((function(e, n, t) {
+            if (w()(v) && !g()(v) || b()(v) && v.length > 0) {
+                var J = x()(v).map((function(e, r, t) {
                     var o = v[e];
  // TS: should be safe based on (recursive) JSONElement type
                                         var a = b()(v) ? parseInt(e, 10) : e;
-                    var i = x.length === 0 ? ".".concat(a) : ".".concat(x.join("."), ".").concat(a);
+                    var i = I.length === 0 ? ".".concat(a) : ".".concat(I.join("."), ".").concat(a);
                     
-                    return r().createElement(fe, {
+                    return n().createElement(fe, {
                         id: i,
                         key: i,
                         propertyDataPath: i,
                         childKey: a,
-                        index: n,
+                        index: r,
                         value: o,
                         properties: t,
                         obj: v,
                         renderValue: F,
                         renderKey: $,
-                        getInitialOpenState: _,
-                        indentArray: P,
+                        getInitialOpenState: D,
+                        indentArray: A,
                         renderExpandLink: q,
-                        onFocus: function e(r, n) {
-                            K = r;
-                            R = n;
+                        onFocus: function e(n, r) {
+                            K = n;
+                            R = r;
                         }
                     });
                 }));
-                if (x.length === 0) {
-                    var U = O()(v) && !g()(v) || b()(v) && v.length > 0;
+                if (I.length === 0) {
+                    var U = w()(v) && !g()(v) || b()(v) && v.length > 0;
                     
-                    return r().createElement(M, {
+                    return n().createElement(M, {
                         id: "root",
                         propertyDataPath: ".",
                         key: ".",
@@ -1264,7 +1367,7 @@
             }
             // edge case: a single number/string/boolean being rendered (still valid JSON)
                         
-            return r().createElement(de, {
+            return n().createElement(de, {
                 obj: v,
                 renderValue: F
             });
@@ -1272,50 +1375,50 @@
         // CONCATENATED MODULE: ./src/JSONTree/JSONTree.tsx
         function ve() {
             return ve = Object.assign ? Object.assign.bind() : function(e) {
-                for (var r = 1; r < arguments.length; r++) {
-                    var n = arguments[r];
-                    for (var t in n) {
-                        ({}).hasOwnProperty.call(n, t) && (e[t] = n[t]);
+                for (var n = 1; n < arguments.length; n++) {
+                    var r = arguments[n];
+                    for (var t in r) {
+                        ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
                     }
                 }
                 return e;
             }, ve.apply(null, arguments);
         }
-        function pe(e, r) {
-            return ge(e) || he(e, r) || me(e, r) || ye();
+        function pe(e, n) {
+            return ge(e) || he(e, n) || me(e, n) || ye();
         }
         function ye() {
             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 me(e, r) {
+        function me(e, n) {
             if (e) {
-                if ("string" == typeof e) return be(e, r);
-                var n = {}.toString.call(e).slice(8, -1);
-                return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? be(e, r) : void 0;
+                if ("string" == typeof e) return be(e, n);
+                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) ? be(e, n) : void 0;
             }
         }
-        function be(e, r) {
-            (null == r || r > e.length) && (r = e.length);
-            for (var n = 0, t = Array(r); n < r; n++) {
-                t[n] = e[n];
+        function be(e, n) {
+            (null == n || n > e.length) && (n = e.length);
+            for (var r = 0, t = Array(n); r < n; r++) {
+                t[r] = e[r];
             }
             return t;
         }
-        function he(e, r) {
-            var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-            if (null != n) {
+        function he(e, n) {
+            var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+            if (null != r) {
                 var t, o, a, i, l = [], u = !0, c = !1;
                 try {
-                    if (a = (n = n.call(e)).next, 0 === r) {
-                        if (Object(n) !== n) return;
+                    if (a = (r = r.call(e)).next, 0 === n) {
+                        if (Object(r) !== r) return;
                         u = !1;
-                    } else for (;!(u = (t = a.call(n)).done) && (l.push(t.value), l.length !== r); u = !0) {
+                    } else for (;!(u = (t = a.call(r)).done) && (l.push(t.value), l.length !== n); u = !0) {
                     }
                 } catch (e) {
                     c = !0, o = e;
                 } finally {
                     try {
-                        if (!u && null != n["return"] && (i = n["return"](), Object(i) !== i)) return;
+                        if (!u && null != r["return"] && (i = r["return"](), Object(i) !== i)) return;
                     } finally {
                         if (c) throw o;
                     }
@@ -1326,31 +1429,31 @@
         function ge(e) {
             if (Array.isArray(e)) return e;
         }
-        function Se(e, r) {
+        function Se(e, n) {
             if (null == e) return {};
-            var n, t, o = we(e, r);
+            var r, t, o = ke(e, n);
             if (Object.getOwnPropertySymbols) {
                 var a = Object.getOwnPropertySymbols(e);
                 for (t = 0; t < a.length; t++) {
-                    n = a[t], r.includes(n) || {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
+                    r = a[t], n.includes(r) || {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
                 }
             }
             return o;
         }
-        function we(e, r) {
+        function ke(e, n) {
             if (null == e) return {};
-            var n = {};
+            var r = {};
             for (var t in e) {
                 if ({}.hasOwnProperty.call(e, t)) {
-                    if (r.includes(t)) continue;
-                    n[t] = e[t];
+                    if (n.includes(t)) continue;
+                    r[t] = e[t];
                 }
             }
-            return n;
+            return r;
         }
         /** @public */
         /** @public */
-        /** @public */        var ke = {
+        /** @public */        var Oe = {
             elementRef: a().oneOfType([ a().func, a().object ]),
             expandChildren: a().oneOfType([ a().bool, a().oneOf([ "withShiftModifier" ]) ]),
             indent: a().number,
@@ -1362,22 +1465,22 @@
         };
         /**
  * Used to visualize a JSON string.
- */        function Oe(n) {
-            var t = n.elementRef, o = n.expandChildren, a = o === void 0 ? false : o, i = n.indent, u = i === void 0 ? 4 : i, c = n.json, f = n.onClickKey, d = n.onClickValue, p = n.overflow, y = p === void 0 ? "scroll" : p, m = n.expandChildrenOnShiftKey, b = m === void 0 ? false : m, h = Se(n, [ "elementRef", "expandChildren", "indent", "json", "onClickKey", "onClickValue", "overflow", "expandChildrenOnShiftKey" ]);
+ */        function we(r) {
+            var t = r.elementRef, o = r.expandChildren, a = o === void 0 ? false : o, i = r.indent, u = i === void 0 ? 4 : i, c = r.json, f = r.onClickKey, d = r.onClickValue, p = r.overflow, y = p === void 0 ? "scroll" : p, m = r.expandChildrenOnShiftKey, b = m === void 0 ? false : m, h = Se(r, [ "elementRef", "expandChildren", "indent", "json", "onClickKey", "onClickValue", "overflow", "expandChildrenOnShiftKey" ]);
             // @docs-props-type JSONTreePropsBase
                         var g = l()(c) ? JSON.parse(c) : c;
             var S = y === "wrap" ? v : s;
-            var w = (0, e.useState)(undefined), k = pe(w, 2), O = k[0], x = k[1];
-            var I = function e(r) {
-                x(r);
+            var k = (0, e.useState)(undefined), O = pe(k, 2), w = O[0], I = O[1];
+            var x = function e(n) {
+                I(n);
             };
             
-            return r().createElement(S, ve({
+            return n().createElement(S, ve({
                 "data-language": "language-json",
                 "data-test": "json-tree",
                 ref: t,
                 role: "tree"
-            }, h),  r().createElement(T["default"], {
+            }, h),  n().createElement(P["default"], {
                 defaultIndent: false
             }, se({
                 defaultOpen: true,
@@ -1388,12 +1491,12 @@
                 onClickKey: f,
                 onClickValue: d,
                 overflow: y,
-                shift: O,
-                updateShift: I
+                shift: w,
+                updateShift: x
             })));
         }
-        Oe.propTypes = ke;
-        /* harmony default export */        const xe = Oe;
+        we.propTypes = Oe;
+        /* harmony default export */        const Ie = we;
     }) // CONCATENATED MODULE: ./src/JSONTree/index.ts
     ();
     module.exports = t;