@splunk/react-ui 5.2.0 → 5.4.0

package/JSONTree.js

@@ -1,755 +1,34 @@
 /******/ (() => {
     // webpackBootstrap
     /******/ "use strict";
-    /******/    var e = {
-        /***/ 8655: 
-        /***/ (e, n, r) => {
-            // EXPORTS
-            r.d(n, {
-                default: () => /* reexport */ ce
-            });
-            // UNUSED EXPORTS: Item
-            // EXTERNAL MODULE: external "react"
-                        var t = r(9497);
-            var o =  r.n(t);
-            // EXTERNAL MODULE: external "prop-types"
-                        var a = r(23);
-            var i =  r.n(a);
-            // EXTERNAL MODULE: external "styled-components"
-                        var l = r(232);
-            var u =  r.n(l);
-            // EXTERNAL MODULE: external "@splunk/themes"
-                        var c = r(3563);
-            // CONCATENATED MODULE: ./src/Tree/ItemStyles.ts
-            var f = u().span.withConfig({
-                displayName: "ItemStyles__StyledTreeItemContentWrapper",
-                componentId: "sc-1ig9nmy-0"
-            })([ "display:inline-block;min-height:100%;" ]);
-            var d = u().span.withConfig({
-                displayName: "ItemStyles__StyledTreeItemIndent",
-                componentId: "sc-1ig9nmy-1"
-            })([ "white-space:pre;" ]);
-            var s = u().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";
-            }), c.variables.focusColor, c.variables.actionColorBackgroundSecondaryHover);
-            // CONCATENATED MODULE: ./src/Tree/TreeContext.tsx
-            var v =  (0, t.createContext)({
-                defaultIndent: true
-            });
-            /* harmony default export */            const p = v;
-            // CONCATENATED MODULE: ./src/Tree/TreeStyles.ts
-            var y = u().ul.withConfig({
-                displayName: "TreeStyles__StyledUnorderedList",
-                componentId: "sc-13pokwt-0"
-            })([ "", ";list-style:none;white-space:inherit;", ";" ], c.mixins.reset("ul"), (function(e) {
-                var n = e.$defaultIndent;
-                return n && (0, l.css)([ "padding-inline-start:", ";" ], c.variables.spacingXXXLarge);
-            }));
-            // 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 m(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 b(e) {
-                "@babel/helpers - typeof";
-                return b = "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;
-                }, b(e);
-            }
-            function h() {
-                return h = 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;
-                }, h.apply(null, arguments);
-            }
-            function g(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 S(e) {
-                for (var n = 1; n < arguments.length; n++) {
-                    var r = null != arguments[n] ? arguments[n] : {};
-                    n % 2 ? g(Object(r), !0).forEach((function(n) {
-                        O(e, n, r[n]);
-                    })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : g(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 w(e) {
-                var n = k(e, "string");
-                return "symbol" == b(n) ? n : n + "";
-            }
-            function k(e, n) {
-                if ("object" != b(e) || !e) return e;
-                var r = e[Symbol.toPrimitive];
-                if (void 0 !== r) {
-                    var t = r.call(e, n || "default");
-                    if ("object" != b(t)) return t;
-                    throw new TypeError("@@toPrimitive must return a primitive value.");
-                }
-                return ("string" === n ? String : Number)(e);
-            }
-            function x(e, n) {
-                return T(e) || E(e, n) || j(e, n) || I();
-            }
-            function I() {
-                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 j(e, n) {
-                if (e) {
-                    if ("string" == typeof e) return C(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) ? C(e, n) : void 0;
-                }
-            }
-            function C(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 E(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 = (r = r.call(e)).next, 0 === n) {
-                            if (Object(r) !== r) return;
-                            u = !1;
-                        } 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 != r["return"] && (i = r["return"](), Object(i) !== i)) return;
-                        } finally {
-                            if (c) throw o;
-                        }
-                    }
-                    return l;
-                }
-            }
-            function T(e) {
-                if (Array.isArray(e)) return e;
-            }
-            function A(e, n) {
-                if (null == e) return {};
-                var r, t, o = P(e, n);
-                if (Object.getOwnPropertySymbols) {
-                    var a = Object.getOwnPropertySymbols(e);
-                    for (t = 0; t < a.length; t++) {
-                        r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-                    }
-                }
-                return o;
-            }
-            function P(e, n) {
-                if (null == e) return {};
-                var r = {};
-                for (var t in e) {
-                    if ({}.hasOwnProperty.call(e, t)) {
-                        if (-1 !== n.indexOf(t)) continue;
-                        r[t] = e[t];
-                    }
-                }
-                return r;
-            }
-            var R = {
-                id: i().string,
-                children: i().node,
-                content: i().node,
-                customIndent: i().node,
-                elementRef: i().oneOfType([ i().func, i().object ]),
-                endAdornment: i().node,
-                expanded: i().bool,
-                onFocus: i().func,
-                onKeyDown: i().func,
-                onToggleSelection: i().func,
-                onToggleExpansion: i().func
-            };
-            /** @public */
-            /** @public */            function _(e) {
-                var n = e.id, r = e.children, a = e.content, i = e.customIndent, l = e.elementRef, u = e.endAdornment, c = e.expanded, v = e.onFocus, b = e.onKeyDown, g = e.onToggleExpansion, O = e.onToggleSelection, w = A(e, [ "id", "children", "content", "customIndent", "elementRef", "endAdornment", "expanded", "onFocus", "onKeyDown", "onToggleExpansion", "onToggleSelection" ]);
-                // @docs-props-type TreeItemPropsBase
-                                var k = (0, t.useContext)(p), I = k.defaultIndent, j = I === void 0 ? true : I, C = k.onItemKeyDown, E = k.onItemClick, T = k.removeNode, P = k.setNode, R = k.itemPaths, _ = k.focusedItemId;
- // make first tree item tabbable
-                                var K = (0, t.useState)((R === null || R === void 0 ? void 0 : R.get("".concat(n))) === "0" ? 0 : -1), N = x(K, 2), D = N[0], V = N[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 (c && 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 $ = (0, t.useCallback)((function(e) {
-                    m(L, e);
-                    m(l, e);
-                }), [ l ]);
-                var M = (0, t.useCallback)((function(e) {
-                    var n;
-                    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 = S({}, r);
-                    if (!r.treeItemId && ((n = e.currentTarget) === null || n === void 0 ? void 0 : n.id)) {
-                        t.treeItemId = e.currentTarget.id;
-                    }
-                    g === null || g === void 0 ? void 0 : g(e, t);
-                }), [ g ]);
-                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();
-                    v === null || v === void 0 ? void 0 : v(e);
-                }), [ v ]);
-                var B = (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 (_ === n) {
-                        var e;
-                        L === null || L === void 0 ? void 0 : (e = L.current) === null || e === void 0 ? void 0 : e.focus();
-                    }
-                }), [ _, n, L ]);
-                var X = (0, t.useCallback)((function(e) {
-                    e.stopPropagation();
-                }), []);
-                var G = (0, t.useCallback)((function(e) {
-                    e.stopPropagation();
-                    if (e.key === " ") {
-                        e.preventDefault();
-                        O === null || O === void 0 ? void 0 : O(e, {
-                            treeItemId: n
-                        });
-                        return;
-                    }
-                    // 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 (e.shiftKey && e.key === "Tab" && (R === null || R === void 0 ? void 0 : R.get("".concat(n))) === "0") {
-                        V(-1);
-                    }
-                    C === null || C === void 0 ? void 0 : C(e, n, c, F, M);
-                    b === null || b === void 0 ? void 0 : b(e);
-                }), [ F, c, M, n, R, C, b, O ]);
-                
-                return o().createElement("li", h({
-                    "data-test": "tree-item"
-                }, w, {
-                    id: n,
-                    ref: $,
-                    tabIndex: D,
-                    onBlur: B,
-                    onFocus: U,
-                    onKeyDown: G,
-                    role: "treeitem",
-                    "aria-expanded": F.length ? c || "false" : undefined
-                }),  o().createElement(f, null,  o().createElement(d, null, i),  o().createElement(s, {
-                    $hasCustomIndent: !!i,
-                    "data-test": "tree-item-content",
-                    ref: q,
-                    tabIndex: -1,
-                    onFocus: X,
-                    onClick: J
-                }, a, !c && u)), c &&  o().createElement(o().Fragment, null,  o().createElement(y, {
-                    role: "group",
-                    $defaultIndent: j
-                }, r), u));
-            }
-            _.propTypes = R;
-            /* harmony default export */            const K = _;
-            // CONCATENATED MODULE: ./src/Tree/treeUtils.ts
-            function N(e, n) {
-                return F(e) || q(e, n) || V(e, n) || D();
-            }
-            function D() {
-                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 V(e, n) {
-                if (e) {
-                    if ("string" == typeof e) return L(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) ? L(e, n) : void 0;
-                }
-            }
-            function L(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 q(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 = (r = r.call(e)).next, 0 === n) {
-                            if (Object(r) !== r) return;
-                            u = !1;
-                        } 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 != r["return"] && (i = r["return"](), Object(i) !== i)) return;
-                        } finally {
-                            if (c) throw o;
-                        }
-                    }
-                    return l;
-                }
-            }
-            function F(e) {
-                if (Array.isArray(e)) return e;
-            }
-            /**
- * A helper function to get first key in Map that matches given value
- */            function $(e, n) {
-                var r;
-                var t = Array.from(e.entries());
-                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 M(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 J(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 U(e) {
-                var n = e.split("-").pop();
-                if (!n) {
-                    return 0;
-                }
-                return parseInt(n, 10) || 0;
-            }
-            function B(e, n) {
-                var r = e.get(n);
-                if (!r) {
-                    return n;
-                }
-                var t = M(r);
-                return $(e, t) || n;
-            }
-            /**
- * A helper function for getNextTreeItem
- */            function X(e, n) {
-                var r = M(n);
-                if (!r) {
-                    return $(e, n);
-                }
-                // get next node in the parent level
-                                var t = U(r);
-                var o = J(r, t);
-                var a = $(e, o);
-                if (a) {
-                    return a;
-                }
-                // continue getting parents until find next node or reach root
-                                return X(e, o);
-            }
-            function G(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(r, "-0"));
-                if (t) {
-                    return t;
-                }
-                // case where next tree item is the next node in the same level
-                                var o = U(r);
-                var a = J(r, o);
-                var i = $(e, a);
-                if (i) {
-                    return i;
-                }
-                // case where next tree item is a higher level or does not exist
-                                return X(e, r) || n;
-            }
-            /**
- * A helper function for getPrevTreeItem
- */            function H(e, n) {
-                var r = $(e, "".concat(n, "-0"));
-                if (!r) {
-                    return $(e, n);
-                }
-                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 = U(o);
-                    var i = J(o, a);
-                    t = $(e, i);
-                    if (t) {
-                        o = i;
-                    }
-                }
-                return H(e, o);
-            }
-            function W(e, n) {
-                var r = e.get(n);
-                if (!r) {
-                    return n;
-                }
-                var t = U(r);
-                // case where current is first child of parent or root item
-                                if (t === 0) {
-                    return B(e, n);
-                }
-                // case where previous tree item is or is a child of previous node in same level
-                                var o = r.replace(/[^-]+$/, "".concat(t - 1));
-                return H(e, o) || n;
-            }
-            function z(e) {
-                return $(e, "0");
-            }
-            function Q(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 (r) {
-                    var o = U(t);
-                    r = $(e, J(t, o));
-                    if (r) {
-                        t = J(t, o);
-                    }
-                }
-                // check if last child has children
-                                var a = $(e, "".concat(t, "-0"));
-                if (!a) {
-                    return $(e, t);
-                }
-                // continue to find its last child recursively
-                                t = "".concat(t, "-0");
-                return Q(e, t);
-            }
-            // CONCATENATED MODULE: ./src/Tree/Tree.tsx
-            function Y() {
-                return Y = 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;
-                }, Y.apply(null, arguments);
-            }
-            function Z(e, n) {
-                return oe(e) || te(e, n) || ne(e, n) || ee();
-            }
-            function ee() {
-                throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-            }
-            function ne(e, n) {
-                if (e) {
-                    if ("string" == typeof e) return re(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) ? re(e, n) : void 0;
-                }
-            }
-            function re(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 te(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 = (r = r.call(e)).next, 0 === n) {
-                            if (Object(r) !== r) return;
-                            u = !1;
-                        } 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 != r["return"] && (i = r["return"](), Object(i) !== i)) return;
-                        } finally {
-                            if (c) throw o;
-                        }
-                    }
-                    return l;
-                }
-            }
-            function oe(e) {
-                if (Array.isArray(e)) return e;
-            }
-            function ae(e, n) {
-                if (null == e) return {};
-                var r, t, o = ie(e, n);
-                if (Object.getOwnPropertySymbols) {
-                    var a = Object.getOwnPropertySymbols(e);
-                    for (t = 0; t < a.length; t++) {
-                        r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-                    }
-                }
-                return o;
-            }
-            function ie(e, n) {
-                if (null == e) return {};
-                var r = {};
-                for (var t in e) {
-                    if ({}.hasOwnProperty.call(e, t)) {
-                        if (-1 !== n.indexOf(t)) continue;
-                        r[t] = e[t];
-                    }
-                }
-                return r;
-            }
-            var le = {
-                children: i().node,
-                defaultIndent: i().bool,
-                elementRef: i().oneOfType([ i().func, i().object ])
-            };
-            /**
- * Used to present a hierarchical list.
- */            function ue(e) {
-                var n = e.children, r = e.defaultIndent, a = r === void 0 ? true : r, i = e.elementRef, l = ae(e, [ "children", "defaultIndent", "elementRef" ]);
-                // @docs-props-type TreePropsBase
-                                var u = (0, t.useState)(), c = Z(u, 2), f = c[0], d = c[1];
-                var s = (0, t.useMemo)((function() {
-                    return new Map;
-                }), []);
-                var v = (0, t.useCallback)((function(e, n, r, t, o) {
-                    e.stopPropagation();
-                    var a = r && (t === null || t === void 0 ? void 0 : t.length);
-                    switch (e.key) {
-                      case "ArrowUp":
-                        e.preventDefault();
-                        d(W(s, n));
-                        break;
-
-                      case "ArrowDown":
-                        e.preventDefault();
-                        d(G(s, n));
-                        break;
-
-                      case "ArrowLeft":
-                        e.preventDefault();
-                        if (a) {
-                            o(e, {
-                                treeItemId: n
-                            });
-                        } else {
-                            d(B(s, n));
-                        }
-                        break;
-
-                      case "ArrowRight":
-                        e.preventDefault();
-                        if (a) {
-                            d(G(s, n));
-                        } else {
-                            o(e, {
-                                treeItemId: n
-                            });
-                        }
-                        break;
-
-                      case "Home":
-                        e.preventDefault();
-                        d(z(s));
-                        break;
-
-                      case "End":
-                        e.preventDefault();
-                        d(Q(s));
-                        break;
-
-                      case "Enter":
-                        e.preventDefault();
-                        o(e, {
-                            treeItemId: n
-                        });
-                        break;
-
-                      default:
- // do nothing
-                                        }
-                }), [ s ]);
-                var m = function e(n, r) {
-                    n.preventDefault();
-                    d(r);
-                };
-                var b = (0, t.useCallback)((function(e) {
-                    s["delete"](e);
-                }), [ s ]);
-                var h = (0, t.useCallback)((function(e, n) {
-                    s.set(e, n);
-                }), [ s ]);
-                var g = t.Children.toArray(n).filter(t.isValidElement);
-                g.forEach((function(e, n) {
-                    if (e.props.id && h) {
-                        h("".concat(e.props.id), "".concat(n));
-                    }
-                }));
-                var S = (0, t.useMemo)((function() {
-                    return {
-                        defaultIndent: a,
-                        onItemKeyDown: v,
-                        onItemClick: m,
-                        removeNode: b,
-                        setNode: h,
-                        itemPaths: s,
-                        focusedItemId: f
-                    };
-                }), [ a, f, s, v, b, h ]);
-                
-                return o().createElement(p.Provider, {
-                    value: S
-                },  o().createElement(y, Y({
-                    "data-test": "tree",
-                    ref: i,
-                    role: "tree",
-                    $defaultIndent: a
-                }, l), n));
-            }
-            ue.propTypes = le;
-            ue.Item = K;
-            /* harmony default export */            const ce = ue;
-        } // CONCATENATED MODULE: ./src/Tree/index.ts
-        /***/ ,
-        /***/ 3563: 
-        /***/ e => {
-            e.exports = require("@splunk/themes");
-            /***/        },
-        /***/ 23: 
-        /***/ e => {
-            e.exports = require("prop-types");
-            /***/        },
-        /***/ 9497: 
-        /***/ e => {
-            e.exports = require("react");
-            /***/        },
-        /***/ 232: 
-        /***/ e => {
-            e.exports = require("styled-components");
-            /***/
-            /******/        }
-    };
-    /************************************************************************/
-    /******/ // The module cache
-    /******/    var n = {};
-    /******/
-    /******/ // The require function
-    /******/    function r(t) {
-        /******/ // Check if module is in cache
-        /******/ var o = n[t];
-        /******/        if (o !== undefined) {
-            /******/ return o.exports;
-            /******/        }
-        /******/ // Create a new module (and put it into the cache)
-        /******/        var a = n[t] = {
-            /******/ // no module.id needed
-            /******/ // no module.loaded needed
-            /******/ exports: {}
-            /******/        };
-        /******/
-        /******/ // Execute the module function
-        /******/        e[t](a, a.exports, r);
-        /******/
-        /******/ // Return the exports of the module
-        /******/        return a.exports;
-        /******/    }
+    /******/ // The require scope
+    /******/    var e = {};
     /******/
     /************************************************************************/
     /******/ /* webpack/runtime/compat get default export */
     /******/    (() => {
         /******/ // getDefaultExport function for compatibility with non-harmony modules
-        /******/ r.n = e => {
-            /******/ var n = e && e.__esModule ? 
-            /******/ () => e["default"]
-            /******/ : () => e
+        /******/ e.n = n => {
+            /******/ var r = n && n.__esModule ? 
+            /******/ () => n["default"]
+            /******/ : () => n
             /******/;
-            r.d(n, {
-                a: n
+            e.d(r, {
+                a: r
             });
-            /******/            return n;
+            /******/            return r;
             /******/        };
         /******/    })();
     /******/
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ r.d = (e, n) => {
-            /******/ for (var t in n) {
-                /******/ if (r.o(n, t) && !r.o(e, t)) {
-                    /******/ Object.defineProperty(e, t, {
+        /******/ e.d = (n, r) => {
+            /******/ for (var t in r) {
+                /******/ if (e.o(r, t) && !e.o(n, t)) {
+                    /******/ Object.defineProperty(n, t, {
                         enumerable: true,
-                        get: n[t]
+                        get: r[t]
                     });
                     /******/                }
                 /******/            }
@@ -758,14 +37,14 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ r.o = (e, n) => Object.prototype.hasOwnProperty.call(e, n)
+        /******/ e.o = (e, n) => Object.prototype.hasOwnProperty.call(e, n)
         /******/;
     })();
     /******/
     /******/ /* webpack/runtime/make namespace object */
     /******/    (() => {
         /******/ // define __esModule on exports
-        /******/ r.r = e => {
+        /******/ e.r = e => {
             /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
                 /******/ Object.defineProperty(e, Symbol.toStringTag, {
                     value: "Module"
@@ -777,708 +56,717 @@
             /******/        };
         /******/    })();
     /******/
-    /************************************************************************/    var t = {};
-    // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
-        (() => {
-        // ESM COMPAT FLAG
-        r.r(t);
-        // EXPORTS
-                r.d(t, {
-            default: () => /* reexport */ Pe
-        });
-        // EXTERNAL MODULE: external "react"
-                var e = r(9497);
-        var n =  r.n(e);
-        // CONCATENATED MODULE: external "lodash/isString"
-        const o = require("lodash/isString");
-        var a =  r.n(o);
-        // EXTERNAL MODULE: external "prop-types"
-                var i = r(23);
-        var l =  r.n(i);
-        // EXTERNAL MODULE: external "styled-components"
-                var u = r(232);
-        var c =  r.n(u);
-        // CONCATENATED MODULE: external "@splunk/react-ui/Tree"
-        const f = require("@splunk/react-ui/Tree");
-        var d =  r.n(f);
-        // EXTERNAL MODULE: external "@splunk/themes"
-                var s = r(3563);
-        // CONCATENATED MODULE: ./src/JSONTree/JSONTreeStyles.ts
-        var v = (0, u.css)([ "", ";", ";color:", ";padding:4px;" ], s.mixins.reset("block"), s.mixins.typography({
-            family: "monospace"
-        }), s.variables.syntaxGray);
-        var p = c().code.withConfig({
-            displayName: "JSONTreeStyles__StyledScrollCode",
-            componentId: "vrdt21-0"
-        })([ "", ";overflow-x:auto;white-space:nowrap;" ], v);
-        var y = c()(d()).withConfig({
-            displayName: "JSONTreeStyles__StyledTree",
-            componentId: "vrdt21-1"
-        })([ "font-family:inherit;ul{font-family:inherit;}" ]);
-        var m = c().code.withConfig({
-            displayName: "JSONTreeStyles__StyledWrapCode",
-            componentId: "vrdt21-2"
-        })([ "", ";white-space:pre-wrap;" ], v);
-        // CONCATENATED MODULE: external "lodash/fill"
-        const b = require("lodash/fill");
-        var h =  r.n(b);
-        // CONCATENATED MODULE: external "lodash/isArray"
-        const g = require("lodash/isArray");
-        var S =  r.n(g);
-        // CONCATENATED MODULE: external "lodash/isEmpty"
-        const O = require("lodash/isEmpty");
-        var w =  r.n(O);
-        // CONCATENATED MODULE: external "lodash/isNumber"
-        const k = require("lodash/isNumber");
-        var x =  r.n(k);
-        // CONCATENATED MODULE: external "lodash/isObject"
-        const I = require("lodash/isObject");
-        var j =  r.n(I);
-        // CONCATENATED MODULE: external "lodash/keys"
-        const C = require("lodash/keys");
-        var E =  r.n(C);
-        // CONCATENATED MODULE: external "lodash/repeat"
-        const T = require("lodash/repeat");
-        var A =  r.n(T);
-        // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
-        const P = require("@splunk/ui-utils/i18n");
-        // CONCATENATED MODULE: external "@splunk/react-ui/ButtonSimple"
-        const R = require("@splunk/react-ui/ButtonSimple");
-        var _ =  r.n(R);
-        // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
-        const K = require("@splunk/react-ui/Clickable");
-        var N =  r.n(K);
-        // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
-        const D = require("@splunk/react-ui/Tooltip");
-        var V =  r.n(D);
-        // CONCATENATED MODULE: ./src/JSONTree/JSONTreeItemStyles.ts
-        var L = {
-            string: s.variables.syntaxTeal,
-            number: s.variables.syntaxBlue,
-            boolean: s.variables.syntaxPurple,
-            null: s.variables.syntaxBrown,
-            object: s.variables.syntaxGray,
-            array: s.variables.syntaxGray
-        };
-        var q = (0, u.css)([ "word-break:break-word;word-wrap:break-word;" ]);
-        var F = (0, u.css)([ "white-space:nowrap;" ]);
-        /* Using this magic number to set the height to be at least the minimum target size of 24 by 24 */        var $ = (0, 
-        u.css)([ "padding-block:2px;" ]);
-        var M = (0, u.css)([ "font-family:inherit;&:focus{box-shadow:", ";outline:0;&:active{box-shadow:none;}}&:hover{background-color:", ";}" ], s.variables.focusShadow, s.variables.neutral50);
-        var J = (0, u.css)([ "color:", ";", ";", "" ], (function(e) {
-            var n = e.valueType;
-            return L[n];
-        }), (function(e) {
-            var n = e.overflowType;
-            return n === "wrap" ? q : F;
-        }), $);
-        var U = c().span.withConfig({
-            displayName: "JSONTreeItemStyles__StyledContentWrapper",
-            componentId: "o558h3-0"
-        })([ "color:", ";" ], s.variables.syntaxGray);
-        var B = c().span.withConfig({
-            displayName: "JSONTreeItemStyles__StyledValue",
-            componentId: "o558h3-1"
-        })([ "", "" ], J);
-        var X = c()(N()).withConfig({
-            displayName: "JSONTreeItemStyles__StyledValueInteractiveClickable",
-            componentId: "o558h3-2"
-        })([ "", " ", " min-width:24px;text-align:center;" ], J, M);
-        var G = (0, u.css)([ "", " color:", ";" ], $, s.variables.syntaxRed);
-        var H = c().span.withConfig({
-            displayName: "JSONTreeItemStyles__StyledProperty",
-            componentId: "o558h3-3"
-        })([ "", "" ], G);
-        var W = c()(N()).withConfig({
-            displayName: "JSONTreeItemStyles__StyledPropertyInteractiveClickable",
-            componentId: "o558h3-4"
-        })([ "", " ", "" ], G, M);
-        var z = c()(_()).withConfig({
-            displayName: "JSONTreeItemStyles__StyledExpandLinkClickable",
-            componentId: "o558h3-5"
-        })([ "", ";border:none;border-radius:0;font-family:inherit;padding:1px ", " 3px ", ";&:hover{background-color:", ";text-decoration:none;}&:focus{box-shadow:", ";&:active{box-shadow:none;}}" ], $, s.variables.spacingXSmall, s.variables.spacingXSmall, s.variables.actionColorBackgroundSubtleHover, s.variables.focusShadowInset);
-        var Q = c()(V()).withConfig({
-            displayName: "JSONTreeItemStyles__StyledTooltip",
-            componentId: "o558h3-6"
-        })([ "font-family:", ";" ], s.variables.monoFontFamily);
-        // EXTERNAL MODULE: ./src/Tree/index.ts + 7 modules
-                var Y = r(8655);
-        // CONCATENATED MODULE: ./src/JSONTree/JSONTreeItem.tsx
-        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;
-            }, Z.apply(null, arguments);
-        }
-        function ee(e, n) {
-            return ae(e) || oe(e, n) || re(e, n) || ne();
-        }
-        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 re(e, n) {
-            if (e) {
-                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;
-            }
+    /************************************************************************/    var n = {};
+    // ESM COMPAT FLAG
+        e.r(n);
+    // EXPORTS
+        e.d(n, {
+        default: () => /* reexport */ Ae
+    });
+    // CONCATENATED MODULE: external "react"
+    const r = require("react");
+    var t =  e.n(r);
+    // CONCATENATED MODULE: external "lodash/isString"
+    const a = require("lodash/isString");
+    var o =  e.n(a);
+    // CONCATENATED MODULE: external "prop-types"
+    const l = require("prop-types");
+    var i =  e.n(l);
+    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
+    const u = require("@splunk/ui-utils/id");
+    // CONCATENATED MODULE: external "styled-components"
+    const c = require("styled-components");
+    var d =  e.n(c);
+    // CONCATENATED MODULE: external "@splunk/react-ui/Tree"
+    const s = require("@splunk/react-ui/Tree");
+    var f =  e.n(s);
+    // CONCATENATED MODULE: external "@splunk/themes"
+    const p = require("@splunk/themes");
+    // CONCATENATED MODULE: ./src/JSONTree/JSONTreeStyles.ts
+    var v = (0, c.css)([ "", ";", ";color:", ";padding:4px;" ], p.mixins.reset("block"), p.mixins.typography({
+        family: "monospace"
+    }), p.variables.syntaxGray);
+    var y = d().code.withConfig({
+        displayName: "JSONTreeStyles__StyledScrollCode",
+        componentId: "vrdt21-0"
+    })([ "", ";overflow-x:auto;white-space:nowrap;" ], v);
+    var b = d()(f()).withConfig({
+        displayName: "JSONTreeStyles__StyledTree",
+        componentId: "vrdt21-1"
+    })([ "font-family:inherit;ul{font-family:inherit;}" ]);
+    var m = d().code.withConfig({
+        displayName: "JSONTreeStyles__StyledWrapCode",
+        componentId: "vrdt21-2"
+    })([ "", ";white-space:pre-wrap;" ], v);
+    // CONCATENATED MODULE: external "lodash/fill"
+    const h = require("lodash/fill");
+    var g =  e.n(h);
+    // CONCATENATED MODULE: external "lodash/isArray"
+    const S = require("lodash/isArray");
+    var k =  e.n(S);
+    // CONCATENATED MODULE: external "lodash/isEmpty"
+    const x = require("lodash/isEmpty");
+    var O =  e.n(x);
+    // CONCATENATED MODULE: external "lodash/isNumber"
+    const w = require("lodash/isNumber");
+    var C =  e.n(w);
+    // CONCATENATED MODULE: external "lodash/isObject"
+    const E = require("lodash/isObject");
+    var I =  e.n(E);
+    // CONCATENATED MODULE: external "lodash/keys"
+    const j = require("lodash/keys");
+    var T =  e.n(j);
+    // CONCATENATED MODULE: external "lodash/repeat"
+    const R = require("lodash/repeat");
+    var A =  e.n(R);
+    // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
+    const P = require("@splunk/ui-utils/i18n");
+    // CONCATENATED MODULE: external "@splunk/react-ui/ButtonSimple"
+    const _ = require("@splunk/react-ui/ButtonSimple");
+    var K =  e.n(_);
+    // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
+    const N = require("@splunk/react-ui/Clickable");
+    var V =  e.n(N);
+    // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
+    const q = require("@splunk/react-ui/Tooltip");
+    var L =  e.n(q);
+    // CONCATENATED MODULE: ./src/JSONTree/JSONTreeItemStyles.ts
+    var D = {
+        string: p.variables.syntaxTeal,
+        number: p.variables.syntaxBlue,
+        boolean: p.variables.syntaxPurple,
+        null: p.variables.syntaxBrown,
+        object: p.variables.syntaxGray,
+        array: p.variables.syntaxGray
+    };
+    var F = (0, c.css)([ "word-break:break-word;word-wrap:break-word;" ]);
+    var J = (0, c.css)([ "white-space:nowrap;" ]);
+    /* Using this magic number to set the height to be at least the minimum target size of 24 by 24 */    var M = (0, 
+    c.css)([ "padding-block:2px;" ]);
+    var B = (0, c.css)([ "font-family:inherit;&:focus{box-shadow:", ";outline:0;&:active{box-shadow:none;}}&:hover{background-color:", ";}" ], p.variables.focusShadow, p.variables.neutral50);
+    var G = (0, c.css)([ "color:", ";", ";", "" ], (function(e) {
+        var n = e.valueType;
+        return D[n];
+    }), (function(e) {
+        var n = e.overflowType;
+        return n === "wrap" ? F : J;
+    }), M);
+    var U = d().span.withConfig({
+        displayName: "JSONTreeItemStyles__StyledContentWrapper",
+        componentId: "o558h3-0"
+    })([ "color:", ";" ], p.variables.syntaxGray);
+    var $ = d().span.withConfig({
+        displayName: "JSONTreeItemStyles__StyledValue",
+        componentId: "o558h3-1"
+    })([ "", "" ], G);
+    var W = d()(V()).withConfig({
+        displayName: "JSONTreeItemStyles__StyledValueInteractiveClickable",
+        componentId: "o558h3-2"
+    })([ "", " ", " min-width:24px;text-align:center;" ], G, B);
+    var X = (0, c.css)([ "", " color:", ";" ], M, p.variables.syntaxRed);
+    var H = d().span.withConfig({
+        displayName: "JSONTreeItemStyles__StyledProperty",
+        componentId: "o558h3-3"
+    })([ "", "" ], X);
+    var z = d()(V()).withConfig({
+        displayName: "JSONTreeItemStyles__StyledPropertyInteractiveClickable",
+        componentId: "o558h3-4"
+    })([ "", " ", "" ], X, B);
+    var Q = d()(K()).withConfig({
+        displayName: "JSONTreeItemStyles__StyledExpandLinkClickable",
+        componentId: "o558h3-5"
+    })([ "", ";border:none;border-radius:0;font-family:inherit;padding:1px ", " 3px ", ";&:hover{background-color:", ";text-decoration:none;}&:focus{box-shadow:", ";&:active{box-shadow:none;}}" ], M, p.variables.spacingXSmall, p.variables.spacingXSmall, p.variables.actionColorBackgroundSubtleHover, p.variables.focusShadowInset);
+    var Y = d()(L()).withConfig({
+        displayName: "JSONTreeItemStyles__StyledTooltip",
+        componentId: "o558h3-6"
+    })([ "font-family:", ";" ], p.variables.monoFontFamily);
+    // CONCATENATED MODULE: ./src/JSONTree/JSONTreeItem.tsx
+    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;
+        }, Z.apply(null, arguments);
+    }
+    function ee(e, n) {
+        return oe(e) || ae(e, n) || re(e, n) || ne();
+    }
+    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 re(e, n) {
+        if (e) {
+            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 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 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];
         }
-        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;
+        return t;
+    }
+    function ae(e, n) {
+        var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+        if (null != r) {
+            var t, a, o, l, i = [], u = !0, c = !1;
+            try {
+                if (o = (r = r.call(e)).next, 0 === n) {
+                    if (Object(r) !== r) return;
+                    u = !1;
+                } else for (;!(u = (t = o.call(r)).done) && (i.push(t.value), i.length !== n); u = !0) {
+                }
+            } catch (e) {
+                c = !0, a = e;
+            } finally {
                 try {
-                    if (a = (r = r.call(e)).next, 0 === n) {
-                        if (Object(r) !== r) return;
-                        u = !1;
-                    } else for (;!(u = (t = a.call(r)).done) && (l.push(t.value), l.length !== n); u = !0) {
-                    }
-                } catch (e) {
-                    c = !0, o = e;
+                    if (!u && null != r["return"] && (l = r["return"](), Object(l) !== l)) return;
                 } finally {
-                    try {
-                        if (!u && null != r["return"] && (i = r["return"](), Object(i) !== i)) return;
-                    } finally {
-                        if (c) throw o;
-                    }
+                    if (c) throw a;
                 }
-                return l;
             }
+            return i;
         }
-        function ae(e) {
-            if (Array.isArray(e)) return e;
-        }
-        function ie(e, n) {
-            if (null == e) return {};
-            var r, t, o = le(e, n);
-            if (Object.getOwnPropertySymbols) {
-                var a = Object.getOwnPropertySymbols(e);
-                for (t = 0; t < a.length; t++) {
-                    r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-                }
+    }
+    function oe(e) {
+        if (Array.isArray(e)) return e;
+    }
+    function le(e, n) {
+        if (null == e) return {};
+        var r, t, a = ie(e, n);
+        if (Object.getOwnPropertySymbols) {
+            var o = Object.getOwnPropertySymbols(e);
+            for (t = 0; t < o.length; t++) {
+                r = o[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (a[r] = e[r]);
             }
-            return o;
         }
-        function le(e, n) {
-            if (null == e) return {};
-            var r = {};
-            for (var t in e) {
-                if ({}.hasOwnProperty.call(e, t)) {
-                    if (-1 !== n.indexOf(t)) continue;
-                    r[t] = e[t];
-                }
+        return a;
+    }
+    function ie(e, n) {
+        if (null == e) return {};
+        var r = {};
+        for (var t in e) {
+            if ({}.hasOwnProperty.call(e, t)) {
+                if (-1 !== n.indexOf(t)) continue;
+                r[t] = e[t];
             }
-            return r;
         }
-        var ue = {
-            clickableKeyRef: l().object,
-            clickableValRef: l().object,
-            hasChildren: l().bool,
-            indentArray: l().arrayOf(l().string),
-            index: l().number,
-            initialOpenState: l().bool,
-            properties: l().arrayOf(l().string),
-            propertyDataPath: l().string,
-            propertyElement: l().node,
-            renderExpandLink: l().func,
-            representation: l().node,
-            value: l().oneOfType([ l().string, l().object, l().array, l().number, l().bool ])
-        };
-        function ce(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 = ie(r, [ "clickableKeyRef", "clickableValRef", "hasChildren", "indentArray", "index", "initialOpenState", "onFocus", "properties", "propertyDataPath", "propertyElement", "renderExpandLink", "representation", "value" ]);
-            var b = (0, e.useState)(u), h = ee(b, 2), g = h[0], O = h[1];
-            var w = (0, e.useCallback)((function() {
-                O((function(e) {
-                    return !e;
-                }));
-            }), []);
-            var k = (0, e.useRef)(null);
-            var x = v ? v({
-                onToggleExpansion: w,
-                open: g,
-                withTooltip: true,
-                expandLinkRef: k
-            }) : {
-                expandLink: undefined
-            }, I = x.expandLink;
-            var j = (f === null || f === void 0 ? void 0 : f.length) && l + 1 < (f === null || f === void 0 ? void 0 : f.length) ? "," : null;
-            
-            return n().createElement(Y["default"].Item, Z({
-                content:  n().createElement(U, null, s, a && (S()(y) ? "[" : "{"), !a &&  n().createElement(n().Fragment, null, p, j), a && I),
-                customIndent: i,
-                "data-test": a ? "node" : null,
-                "data-test-path": d,
-                endAdornment: a &&  n().createElement(U, null, g && i, S()(y) ? "]" : "}", j),
-                expanded: g,
-                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 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 === (k === null || k === void 0 ? void 0 : k.current) ? n.relatedTarget : null;
-                    if (m.id === "root") {
-                        var a;
-                        k === null || k === void 0 ? void 0 : (a = k.current) === null || a === void 0 ? void 0 : a.focus();
-                    }
-                    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;
-                            (i = t.current) === null || i === void 0 ? void 0 : i.focus();
-                        } else if (o === null || o === void 0 ? void 0 : o.current) {
-                            var l;
-                            (l = o.current) === null || l === void 0 ? void 0 : l.focus();
-                        }
-                    } else {
-                        r.focus();
+        return r;
+    }
+    var ue = {
+        clickableKeyRef: i().object,
+        clickableValRef: i().object,
+        hasChildren: i().bool,
+        indentArray: i().arrayOf(i().string),
+        index: i().number,
+        initialOpenState: i().bool,
+        isRoot: i().bool,
+        properties: i().arrayOf(i().string),
+        propertyDataPath: i().string,
+        propertyElement: i().node,
+        renderExpandLink: i().func,
+        representation: i().node,
+        value: i().oneOfType([ i().string, i().object, i().array, i().number, i().bool ])
+    };
+    function ce(e) {
+        var n = e.clickableKeyRef, a = e.clickableValRef, o = e.hasChildren, l = e.indentArray, i = e.index, u = e.initialOpenState, c = e.isRoot, d = e.onFocus, s = e.properties, p = e.propertyDataPath, v = e.propertyElement, y = e.renderExpandLink, b = e.representation, m = e.value, h = le(e, [ "clickableKeyRef", "clickableValRef", "hasChildren", "indentArray", "index", "initialOpenState", "isRoot", "onFocus", "properties", "propertyDataPath", "propertyElement", "renderExpandLink", "representation", "value" ]);
+        // @docs-props-type JSONTreeItemPropsBase
+                var g = (0, r.useState)(u), S = ee(g, 2), x = S[0], O = S[1];
+        var w = (0, r.useCallback)((function() {
+            O((function(e) {
+                return !e;
+            }));
+        }), []);
+        var C = (0, r.useRef)(null);
+        var E = y ? y({
+            onToggleExpansion: w,
+            open: x,
+            withTooltip: true,
+            expandLinkRef: C
+        }) : {
+            expandLink: undefined
+        }, I = E.expandLink;
+        var j = (s === null || s === void 0 ? void 0 : s.length) && i + 1 < (s === null || s === void 0 ? void 0 : s.length) ? "," : null;
+        
+        return t().createElement(f().Item, Z({
+            content:  t().createElement(U, null, v, o && (k()(m) ? "[" : "{"), !o &&  t().createElement(t().Fragment, null, b, j), o && I),
+            customIndent: l,
+            "data-test": o ? "node" : null,
+            "data-test-path": p,
+            endAdornment: o &&  t().createElement(U, null, x && l, k()(m) ? "]" : "}", j),
+            expanded: x,
+            onFocus: function e(r) {
+                d === null || d === void 0 ? void 0 : d(r);
+                // check if onFocus was triggered by a click event or expand link
+                                var t = r.relatedTarget === (n === null || n === void 0 ? void 0 : n.current) || r.relatedTarget === (a === null || a === void 0 ? void 0 : a.current) || r.relatedTarget === (C === null || C === void 0 ? void 0 : C.current) ? r.relatedTarget : null;
+                if (c) {
+                    var o;
+                    C === null || C === void 0 ? void 0 : (o = C.current) === null || o === void 0 ? void 0 : o.focus();
+                }
+                if (!t) {
+                    // if JSONTreeItem contains clickable keys/vals, focus should go there
+                    if (v && (n === null || n === void 0 ? void 0 : n.current)) {
+                        var l;
+                        (l = n.current) === null || l === void 0 ? void 0 : l.focus();
+                    } else if (a === null || a === void 0 ? void 0 : a.current) {
+                        var i;
+                        (i = a.current) === null || i === void 0 ? void 0 : i.focus();
                     }
-                },
-                onToggleExpansion: w,
-                tabIndex: 0
-            }, m), a && p);
-        }
-        ce.propTypes = ue;
-        // CONCATENATED MODULE: ./src/JSONTree/renderTreeItems.tsx
-        function fe(e) {
-            "@babel/helpers - typeof";
-            return fe = "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;
-            }, fe(e);
-        }
-        function de(e) {
-            return ye(e) || pe(e) || ve(e) || se();
+                } else {
+                    t.focus();
+                }
+            },
+            onToggleExpansion: w,
+            tabIndex: 0
+        }, h), o && b);
+    }
+    ce.propTypes = ue;
+    // CONCATENATED MODULE: ./src/JSONTree/renderTreeItems.tsx
+    function de(e) {
+        "@babel/helpers - typeof";
+        return de = "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;
+        }, de(e);
+    }
+    function se(e) {
+        return ye(e) || ve(e) || pe(e) || fe();
+    }
+    function fe() {
+        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 pe(e, n) {
+        if (e) {
+            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 se() {
-            throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+    }
+    function ve(e) {
+        if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
+    }
+    function ye(e) {
+        if (Array.isArray(e)) return be(e);
+    }
+    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];
         }
-        function ve(e, n) {
-            if (e) {
-                if ("string" == typeof e) return me(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) ? me(e, n) : void 0;
+        return t;
+    }
+    function me(e) {
+        var n = e.id, a = e.childKey, o = e.index, l = e.value, i = e.properties, u = e.propertyDataPath, c = e.obj, d = e.renderValue, s = e.renderKey, f = e.getInitialOpenState, p = e.indentArray, v = e.renderExpandLink, y = e.onFocus;
+        var b = (0, r.useRef)(null);
+        var m = (0, r.useRef)(null);
+        var h = d({
+            key: a,
+            value: l,
+            clickValueRef: b
+        }), g = h.representation, S = h.clickableValRef;
+        var x = !k()(c) ? s(a, m) : {
+            propertyElement: undefined,
+            clickableKeyRef: undefined
+        }, w = x.propertyElement, C = x.clickableKeyRef;
+        var E = I()(l) && !O()(l) || k()(l) && l.length > 0;
+        
+        return t().createElement(ce, {
+            id: n,
+            propertyDataPath: u,
+            propertyElement: w,
+            hasChildren: E,
+            initialOpenState: f(),
+            representation: g,
+            indentArray: p,
+            value: l,
+            index: o,
+            properties: i,
+            renderExpandLink: v,
+            clickableKeyRef: C,
+            clickableValRef: S,
+            onFocus: function e() {
+                y(C, S);
             }
-        }
-        function pe(e) {
-            if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
-        }
-        function ye(e) {
-            if (Array.isArray(e)) return me(e);
-        }
-        function me(e, n) {
-            (null == n || n > e.length) && (n = e.length);
-            for (var r = 0, t = Array(n); r < n; r++) {
-                t[r] = e[r];
+        });
+    }
+    function he(e) {
+        var n = e.baseId, a = e.renderValue, o = e.obj;
+        var l = (0, r.useRef)(null);
+        var i = a({
+            value: o,
+            clickValueRef: l
+        }), u = i.representation;
+        
+        return t().createElement(f().Item, {
+            id: "".concat(n, "-0"),
+            "data-test-path": ".",
+            content: u
+        });
+    }
+    function ge(e) {
+        var n = e.baseId, r = e.defaultOpen, a = r === void 0 ? false : r, l = e.defaultExpanded, i = l === void 0 ? false : l, u = e.expandChildrenOnShiftKey, c = u === void 0 ? false : u, d = e.indent, s = d === void 0 ? 4 : d, f = e.indentLevel, p = f === void 0 ? 1 : f, v = e.obj, y = e.onClickKey, b = e.onClickValue, m = e.overflow, h = m === void 0 ? "scroll" : m, S = e.path, x = S === void 0 ? [] : S, w = e.shift, E = e.updateShift;
+        var j = g()(Array(p), A()(" ", s));
+        var R;
+        var _;
+        var K = function e() {
+            if (i && w == null) {
+                return true;
+            }
+            if (c) {
+                return !!w;
+            }
+            return a;
+        };
+        var N = function e(n) {
+            if (c && E != null) {
+                E(n.shiftKey);
             }
-            return t;
-        }
-        function be(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 b = (0, e.useRef)(null);
-            var h = f({
-                key: o,
-                value: i,
-                clickValueRef: m
-            }), g = h.representation, O = h.clickableValRef;
-            var k = !S()(c) ? d(o, b) : {
-                propertyElement: undefined,
-                clickableKeyRef: undefined
-            }, x = k.propertyElement, I = k.clickableKeyRef;
-            var C = j()(i) && !w()(i) || S()(i) && i.length > 0;
-            
-            return n().createElement(ce, {
-                id: t,
-                propertyDataPath: u,
-                propertyElement: x,
-                hasChildren: C,
-                initialOpenState: s(),
-                representation: g,
-                indentArray: v,
-                value: i,
-                index: a,
-                properties: l,
-                renderExpandLink: p,
-                clickableKeyRef: I,
-                clickableValRef: O,
-                onFocus: function e() {
-                    y(I, O);
-                }
+        };
+        var V = function e(n, r) {
+            var t, a;
+            // When rendering a single value key is not present, here we prevent `[undefined]` in path
+                        var o = r !== undefined ? [].concat(se(x), [ r ]) : se(x);
+            var l = ".".concat(o.join("."));
+            (t = _) === null || t === void 0 ? void 0 : (a = t.current) === null || a === void 0 ? void 0 : a.focus();
+            y === null || y === void 0 ? void 0 : y(n, {
+                key: l,
+                keyPath: o
             });
-        }
-        function he(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 n().createElement(Y["default"].Item, {
-                id: "0",
-                "data-test-path": ".",
-                content: l
+        };
+        var q = function e(n, r) {
+            var t, a;
+            // When rendering a single value key is not present, here we prevent `[undefined]` in path
+                        var o = r !== undefined ? [].concat(se(x), [ r ]) : se(x);
+            var l = ".".concat(o.join("."));
+            (t = R) === null || t === void 0 ? void 0 : (a = t.current) === null || a === void 0 ? void 0 : a.focus();
+            b === null || b === void 0 ? void 0 : b(n, {
+                key: l,
+                keyPath: o,
+                value: n.target.textContent
             });
-        }
-        function ge(e) {
-            var r = e.defaultOpen, t = r === void 0 ? false : r, o = e.defaultExpanded, i = o === void 0 ? false : o, l = e.expandChildrenOnShiftKey, u = l === void 0 ? false : l, c = e.indent, f = c === void 0 ? 4 : c, d = e.indentLevel, s = d === void 0 ? 1 : d, v = e.obj, p = e.onClickKey, y = e.onClickValue, m = e.overflow, b = m === void 0 ? "scroll" : m, g = e.path, O = g === void 0 ? [] : g, k = e.shift, I = e.updateShift;
-            var C = h()(Array(s), A()(" ", f));
-            var T;
-            var R;
-            var _ = function e() {
-                if (i && k == null) {
-                    return true;
-                }
-                if (u) {
-                    return !!k;
-                }
-                return t;
-            };
-            var K = function e(n) {
-                if (u && I != null) {
-                    I(n.shiftKey);
-                }
-            };
-            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 = r !== undefined ? [].concat(de(O), [ r ]) : de(O);
-                var i = ".".concat(a.join("."));
-                (t = R) === 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(n, {
-                    key: i,
-                    keyPath: a
-                });
-            };
-            var D = function e(n, r) {
-                var t, o;
-                // When rendering a single value key is not present, here we prevent `[undefined]` in path
-                                var a = r !== undefined ? [].concat(de(O), [ r ]) : de(O);
-                var i = ".".concat(a.join("."));
-                (t = T) === null || t === void 0 ? void 0 : (o = t.current) === null || o === void 0 ? void 0 : o.focus();
-                y === null || y === void 0 ? void 0 : y(n, {
-                    key: i,
-                    keyPath: a,
-                    value: n.target.textContent
-                });
-            };
-            var V = function e(n, r) {
-                var t, o;
-                var a = n.key;
-                if (a === "ArrowLeft" && p && ((t = R) === null || t === void 0 ? void 0 : t.current) && !r) {
-                    var i;
-                    n.stopPropagation();
-                    (i = R.current) === null || i === void 0 ? void 0 : i.focus();
-                }
-                if (a === "ArrowRight" && y && ((o = T) === null || o === void 0 ? void 0 : o.current) && r) {
-                    var l;
-                    n.stopPropagation();
-                    (l = T.current) === null || l === void 0 ? void 0 : l.focus();
-                }
-            };
-            var L = function e(r) {
-                var t = r.onToggleExpansion, o = r.open, a = r.withTooltip, i = r.expandLinkRef;
-                var l = o ? "[-]" : "[+]";
-                var c = o ? (0, P._)("Collapse all") : (0, P._)("Shift click to expand all");
-                var f =  n().createElement(z, {
-                    appearance: "subtle",
-                    elementRef: i,
-                    tabIndex: -1,
-                    onClick: function e(n) {
-                        K(n);
-                        t === null || t === void 0 ? void 0 : t(n);
-                    },
-                    "aria-expanded": o,
-                    "data-test": "toggle"
-                }, l);
-                if (u && a) {
-                    return {
-                        expandLink:  n().createElement(Q, {
-                            contentRelationship: "description",
-                            openDelay: "secondary",
-                            defaultPlacement: "above",
-                            content: (0, P._)(c)
-                        }, f),
-                        expandLinkRef: i
-                    };
-                }
+        };
+        var L = function e(n, r) {
+            var t, a;
+            var o = n.key;
+            if (o === "ArrowLeft" && y && ((t = _) === null || t === void 0 ? void 0 : t.current) && !r) {
+                var l;
+                n.stopPropagation();
+                (l = _.current) === null || l === void 0 ? void 0 : l.focus();
+            }
+            if (o === "ArrowRight" && b && ((a = R) === null || a === void 0 ? void 0 : a.current) && r) {
+                var i;
+                n.stopPropagation();
+                (i = R.current) === null || i === void 0 ? void 0 : i.focus();
+            }
+        };
+        var D = function e(n) {
+            var r = n.onToggleExpansion, a = n.open, o = n.withTooltip, l = n.expandLinkRef;
+            var i = a ? "[-]" : "[+]";
+            var u = a ? (0, P._)("Collapse all") : (0, P._)("Shift click to expand all");
+            var d =  t().createElement(Q, {
+                appearance: "subtle",
+                elementRef: l,
+                tabIndex: -1,
+                onClick: function e(n) {
+                    N(n);
+                    r === null || r === void 0 ? void 0 : r(n);
+                },
+                "aria-expanded": a,
+                "data-test": "toggle"
+            }, i);
+            if (c && o) {
                 return {
-                    expandLink: f,
-                    expandLinkRef: i
+                    expandLink:  t().createElement(Y, {
+                        contentRelationship: "description",
+                        openDelay: "secondary",
+                        defaultPlacement: "above",
+                        content: (0, P._)(u)
+                    }, d),
+                    expandLinkRef: l
                 };
+            }
+            return {
+                expandLink: d,
+                expandLinkRef: l
             };
-            var q = function e(r) {
-                var t = r.value, o = r.key, l = r.clickValueRef;
-                var c;
-                if (!j()(t)) {
-                    if (typeof t === "string") {
-                        c = '"'.concat(t, '"');
-                    } else if (typeof t === "boolean") {
-                        c = t.toString();
-                    } else if (t === null) {
-                        c = "null";
-                    } else {
-                        c = t;
-                    }
-                } else if (w()(t)) {
-                    // isObject is true for arrays
-                    c = S()(t) ? "[]" : "{}";
+        };
+        var F = function e(r) {
+            var a = r.value, l = r.key, u = r.clickValueRef;
+            var d;
+            if (!I()(a)) {
+                if (typeof a === "string") {
+                    d = '"'.concat(a, '"');
+                } else if (typeof a === "boolean") {
+                    d = a.toString();
+                } else if (a === null) {
+                    d = "null";
                 } else {
-                    c = ge({
-                        defaultOpen: i === true,
-                        defaultExpanded: i,
-                        expandChildrenOnShiftKey: u,
-                        onClickKey: p,
-                        onClickValue: y,
-                        overflow: b,
-                        obj: t,
-                        path: o !== undefined ? [].concat(de(O), [ o ]) : de(O),
-                        indentLevel: s + 1,
-                        shift: k,
-                        updateShift: I
-                    });
-                }
-                if (a()(c) || x()(c)) {
-                    var f = t === null ? "null" : // TS: bigint, function, symbol are prevented by JSONElement type
-                    fe(t);
-                    if (y) {
-                        return {
-                            representation:  n().createElement(X, {
-                                elementRef: l,
-                                valueType: f,
-                                overflowType: b,
-                                onClick: function e(n) {
-                                    T = l;
-                                    D(n, o);
-                                },
-                                onKeyDown: function e(n) {
-                                    V(n, false);
-                                },
-                                tabIndex: -1
-                            }, c),
-                            clickableValRef: l
-                        };
-                    }
-                    return {
-                        representation:  n().createElement(B, {
-                            valueType: f,
-                            overflowType: b
-                        }, c)
-                    };
-                }
-                return {
-                    representation: c
-                };
-            };
-            var F = function e(r, t) {
-                if (p) {
+                    d = a;
+                }
+            } else if (O()(a)) {
+                // isObject is true for arrays
+                d = k()(a) ? "[]" : "{}";
+            } else {
+                d = ge({
+                    baseId: n,
+                    defaultOpen: i === true,
+                    defaultExpanded: i,
+                    expandChildrenOnShiftKey: c,
+                    onClickKey: y,
+                    onClickValue: b,
+                    overflow: h,
+                    obj: a,
+                    path: l !== undefined ? [].concat(se(x), [ l ]) : se(x),
+                    indentLevel: p + 1,
+                    shift: w,
+                    updateShift: E
+                });
+            }
+            if (o()(d) || C()(d)) {
+                var s = a === null ? "null" : // TS: bigint, function, symbol are prevented by JSONElement type
+                de(a);
+                if (b) {
                     return {
-                        propertyElement:  n().createElement(n().Fragment, null,  n().createElement(W, {
-                            elementRef: t,
-                            tabIndex: -1,
+                        representation:  t().createElement(W, {
+                            elementRef: u,
+                            valueType: s,
+                            overflowType: h,
                             onClick: function e(n) {
-                                R = t;
-                                N(n, r);
+                                R = u;
+                                q(n, l);
                             },
                             onKeyDown: function e(n) {
-                                V(n, true);
-                            }
-                        }, r), ":", " "),
-                        clickableKeyRef: t
+                                L(n, false);
+                            },
+                            tabIndex: -1
+                        }, d),
+                        clickableValRef: u
                     };
                 }
                 return {
-                    propertyElement:  n().createElement(n().Fragment, null,  n().createElement(H, null, r), ":", " ")
+                    representation:  t().createElement($, {
+                        valueType: s,
+                        overflowType: h
+                    }, d)
                 };
+            }
+            return {
+                representation: d
             };
-            if (j()(v) && !w()(v) || S()(v) && v.length > 0) {
-                var $ = E()(v).map((function(e, r, t) {
-                    var o = v[e];
- // TS: should be safe based on (recursive) JSONElement type
-                                        var a = S()(v) ? parseInt(e, 10) : e;
-                    var i = O.length === 0 ? ".".concat(a) : ".".concat(O.join("."), ".").concat(a);
-                    
-                    return n().createElement(be, {
-                        id: i,
-                        key: i,
-                        propertyDataPath: i,
-                        childKey: a,
-                        index: r,
-                        value: o,
-                        properties: t,
-                        obj: v,
-                        renderValue: q,
-                        renderKey: F,
-                        getInitialOpenState: _,
-                        indentArray: C,
-                        renderExpandLink: L,
-                        onFocus: function e(n, r) {
-                            R = n;
-                            T = r;
+        };
+        var J = function e(n, r) {
+            if (y) {
+                return {
+                    propertyElement:  t().createElement(t().Fragment, null,  t().createElement(z, {
+                        elementRef: r,
+                        tabIndex: -1,
+                        onClick: function e(t) {
+                            _ = r;
+                            V(t, n);
+                        },
+                        onKeyDown: function e(n) {
+                            L(n, true);
                         }
-                    });
-                }));
-                if (O.length === 0) {
-                    var M = j()(v) && !w()(v) || S()(v) && v.length > 0;
-                    
-                    return n().createElement(ce, {
-                        id: "root",
-                        propertyDataPath: ".",
-                        key: ".",
-                        hasChildren: M,
-                        initialOpenState: t || i,
-                        value: v,
-                        index: 0,
-                        renderExpandLink: L,
-                        representation: $
-                    });
-                }
-                return $;
+                    }, n), ":", " "),
+                    clickableKeyRef: r
+                };
             }
-            // edge case: a single number/string/boolean being rendered (still valid JSON)
-                        
-            return n().createElement(he, {
-                obj: v,
-                renderValue: q
-            });
-        }
-        // CONCATENATED MODULE: ./src/JSONTree/JSONTree.tsx
-        function Se() {
-            return Se = 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 {
+                propertyElement:  t().createElement(t().Fragment, null,  t().createElement(H, null, n), ":", " ")
+            };
+        };
+        if (I()(v) && !O()(v) || k()(v) && v.length > 0) {
+            var M = T()(v).map((function(e, r, a) {
+                var o = v[e];
+ // TS: should be safe based on (recursive) JSONElement type
+                                var l = k()(v) ? parseInt(e, 10) : e;
+                var i = x.length === 0 ? ".".concat(l) : ".".concat(x.join("."), ".").concat(l);
+                
+                return t().createElement(me, {
+                    id: "".concat(n, "-").concat(i),
+                    key: i,
+                    propertyDataPath: i,
+                    childKey: l,
+                    index: r,
+                    value: o,
+                    properties: a,
+                    obj: v,
+                    renderValue: F,
+                    renderKey: J,
+                    getInitialOpenState: K,
+                    indentArray: j,
+                    renderExpandLink: D,
+                    onFocus: function e(n, r) {
+                        _ = n;
+                        R = r;
                     }
-                }
-                return e;
-            }, Se.apply(null, arguments);
-        }
-        function Oe(e, n) {
-            return je(e) || Ie(e, n) || ke(e, n) || we();
-        }
-        function we() {
-            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 ke(e, n) {
-            if (e) {
-                if ("string" == typeof e) return xe(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) ? xe(e, n) : void 0;
+                });
+            }));
+            if (x.length === 0) {
+                var B = I()(v) && !O()(v) || k()(v) && v.length > 0;
+                
+                return t().createElement(ce, {
+                    id: "".concat(n, "-root"),
+                    isRoot: true,
+                    propertyDataPath: ".",
+                    key: ".",
+                    hasChildren: B,
+                    initialOpenState: a || i,
+                    value: v,
+                    index: 0,
+                    renderExpandLink: D,
+                    representation: M
+                });
             }
+            return M;
         }
-        function xe(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;
+        // edge case: a single number/string/boolean being rendered (still valid JSON)
+                
+        return t().createElement(he, {
+            baseId: n,
+            obj: v,
+            renderValue: F
+        });
+    }
+    // CONCATENATED MODULE: ./src/JSONTree/JSONTree.tsx
+    function Se() {
+        return Se = 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;
+        }, Se.apply(null, arguments);
+    }
+    function ke(e, n) {
+        return Ee(e) || Ce(e, n) || Oe(e, n) || xe();
+    }
+    function xe() {
+        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 Oe(e, n) {
+        if (e) {
+            if ("string" == typeof e) return we(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) ? we(e, n) : void 0;
+        }
+    }
+    function we(e, n) {
+        (null == n || n > e.length) && (n = e.length);
+        for (var r = 0, t = Array(n); r < n; r++) {
+            t[r] = e[r];
         }
-        function Ie(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;
+        return t;
+    }
+    function Ce(e, n) {
+        var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+        if (null != r) {
+            var t, a, o, l, i = [], u = !0, c = !1;
+            try {
+                if (o = (r = r.call(e)).next, 0 === n) {
+                    if (Object(r) !== r) return;
+                    u = !1;
+                } else for (;!(u = (t = o.call(r)).done) && (i.push(t.value), i.length !== n); u = !0) {
+                }
+            } catch (e) {
+                c = !0, a = e;
+            } finally {
                 try {
-                    if (a = (r = r.call(e)).next, 0 === n) {
-                        if (Object(r) !== r) return;
-                        u = !1;
-                    } else for (;!(u = (t = a.call(r)).done) && (l.push(t.value), l.length !== n); u = !0) {
-                    }
-                } catch (e) {
-                    c = !0, o = e;
+                    if (!u && null != r["return"] && (l = r["return"](), Object(l) !== l)) return;
                 } finally {
-                    try {
-                        if (!u && null != r["return"] && (i = r["return"](), Object(i) !== i)) return;
-                    } finally {
-                        if (c) throw o;
-                    }
+                    if (c) throw a;
                 }
-                return l;
             }
+            return i;
         }
-        function je(e) {
-            if (Array.isArray(e)) return e;
-        }
-        function Ce(e, n) {
-            if (null == e) return {};
-            var r, t, o = Ee(e, n);
-            if (Object.getOwnPropertySymbols) {
-                var a = Object.getOwnPropertySymbols(e);
-                for (t = 0; t < a.length; t++) {
-                    r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-                }
+    }
+    function Ee(e) {
+        if (Array.isArray(e)) return e;
+    }
+    function Ie(e, n) {
+        if (null == e) return {};
+        var r, t, a = je(e, n);
+        if (Object.getOwnPropertySymbols) {
+            var o = Object.getOwnPropertySymbols(e);
+            for (t = 0; t < o.length; t++) {
+                r = o[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (a[r] = e[r]);
             }
-            return o;
         }
-        function Ee(e, n) {
-            if (null == e) return {};
-            var r = {};
-            for (var t in e) {
-                if ({}.hasOwnProperty.call(e, t)) {
-                    if (-1 !== n.indexOf(t)) continue;
-                    r[t] = e[t];
-                }
+        return a;
+    }
+    function je(e, n) {
+        if (null == e) return {};
+        var r = {};
+        for (var t in e) {
+            if ({}.hasOwnProperty.call(e, t)) {
+                if (-1 !== n.indexOf(t)) continue;
+                r[t] = e[t];
             }
-            return r;
         }
-        /** @public */
-        /** @public */
-        /** @public */        var Te = {
-            elementRef: l().oneOfType([ l().func, l().object ]),
-            defaultExpanded: l().bool,
-            indent: l().number,
-            json: l().oneOfType([ l().string, l().object, l().array, l().number, l().bool ]).isRequired,
-            onClickKey: l().func,
-            onClickValue: l().func,
-            overflow: l().oneOf([ "wrap", "scroll" ]),
-            expandChildrenOnShiftKey: l().bool
-        };
-        /**
+        return r;
+    }
+    /** @public */
+    /** @public */
+    /** @public */    var Te = {
+        elementRef: i().oneOfType([ i().func, i().object ]),
+        defaultExpanded: i().bool,
+        indent: i().number,
+        json: i().oneOfType([ i().string, i().object, i().array, i().number, i().bool ]).isRequired,
+        onClickKey: i().func,
+        onClickValue: i().func,
+        overflow: i().oneOf([ "wrap", "scroll" ]),
+        expandChildrenOnShiftKey: i().bool
+    };
+    /**
  * Used to visualize a JSON string.
- */        function Ae(r) {
-            var t = r.elementRef, o = r.defaultExpanded, i = o === void 0 ? false : o, l = r.indent, u = l === void 0 ? 4 : l, c = r.json, f = r.onClickKey, d = r.onClickValue, s = r.overflow, v = s === void 0 ? "scroll" : s, b = r.expandChildrenOnShiftKey, h = b === void 0 ? true : b, g = Ce(r, [ "elementRef", "defaultExpanded", "indent", "json", "onClickKey", "onClickValue", "overflow", "expandChildrenOnShiftKey" ]);
-            // @docs-props-type JSONTreePropsBase
-                        var S = a()(c) ? JSON.parse(c) : c;
-            var O = v === "wrap" ? m : p;
-            var w = (0, e.useState)(undefined), k = Oe(w, 2), x = k[0], I = k[1];
-            var j = function e(n) {
-                I(n);
-            };
-            
-            return n().createElement(O, Se({
-                "data-language": "language-json",
-                "data-test": "json-tree",
-                ref: t,
-                role: "tree"
-            }, g),  n().createElement(y, {
-                defaultIndent: false
-            }, ge({
+ */    function Re(e) {
+        var n = e.elementRef, a = e.defaultExpanded, l = a === void 0 ? false : a, i = e.indent, c = i === void 0 ? 4 : i, d = e.json, s = e.onClickKey, f = e.onClickValue, p = e.overflow, v = p === void 0 ? "scroll" : p, h = e.expandChildrenOnShiftKey, g = h === void 0 ? true : h, S = Ie(e, [ "elementRef", "defaultExpanded", "indent", "json", "onClickKey", "onClickValue", "overflow", "expandChildrenOnShiftKey" ]);
+        // @docs-props-type JSONTreePropsBase
+                var k = (0, r.useMemo)((function() {
+            return S.id || (0, u.createDOMID)("json-tree");
+        }), [ S.id ]);
+        var x = o()(d) ? JSON.parse(d) : d;
+        var O = v === "wrap" ? m : y;
+        var w = (0, r.useState)(undefined), C = ke(w, 2), E = C[0], I = C[1];
+        var j = (0, r.useCallback)((function(e) {
+            I(e);
+        }), []);
+        var T = (0, r.useMemo)((function() {
+            return ge({
+                baseId: k,
                 defaultOpen: true,
-                defaultExpanded: i,
-                expandChildrenOnShiftKey: h,
-                indent: u,
-                obj: S,
-                onClickKey: f,
-                onClickValue: d,
+                defaultExpanded: l,
+                expandChildrenOnShiftKey: g,
+                indent: c,
+                obj: x,
+                onClickKey: s,
+                onClickValue: f,
                 overflow: v,
-                shift: x,
+                shift: E,
                 updateShift: j
-            })));
-        }
-        Ae.propTypes = Te;
-        /* harmony default export */        const Pe = Ae;
-    }) // CONCATENATED MODULE: ./src/JSONTree/index.ts
-    ();
-    module.exports = t;
+            });
+        }), [ k, l, g, c, x, s, f, v, E, j ]);
+        
+        return t().createElement(O, Se({
+            "data-language": "language-json",
+            "data-test": "json-tree",
+            ref: n,
+            role: "tree"
+        }, S),  t().createElement(b, {
+            defaultIndent: false
+        }, T));
+    }
+    Re.propTypes = Te;
+    /* harmony default export */    const Ae = Re;
+    // CONCATENATED MODULE: ./src/JSONTree/index.ts
+    module.exports = n;
     /******/})();