bippy 0.3.13 → 0.3.15

package/dist/experiments/inspect.js

@@ -1,18 +1,19 @@
-import { getFiberSource } from '../chunk-FUZZZTS6.js';
-import '../chunk-H6ZLR634.js';
-import { getFiberFromHostInstance, getLatestFiber, getDisplayName, isInstrumentationActive, hasRDTHook, getRDTHook, detectReactBuildType } from '../chunk-3DXHQSXK.js';
-import '../chunk-EPG3GO3H.js';
-import React14, { createContext, memo, Children, useContext, useCallback, useState, useLayoutEffect, forwardRef, useMemo, useEffect, useImperativeHandle as useImperativeHandle$1 } from 'react';
-import ReactDOM from 'react-dom';
-
 /**
  * @license bippy
  *
- * Copyright (c) Aiden Bai, Million Software, Inc.
+ * Copyright (c) Aiden Bai
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+import { getFiberSource } from "../source-CAKKlkON.js";
+import { detectReactBuildType, getDisplayName, getFiberFromHostInstance, getLatestFiber, getRDTHook, hasRDTHook, isInstrumentationActive } from "../core-BHLOH6E0.js";
+import "../src-CAEV45VU.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import React, { Children, createContext, forwardRef, memo, useCallback, useContext, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useState } from "react";
+import ReactDOM from "react-dom";
+
+//#region ../../node_modules/.pnpm/react-inspector@6.0.2_react@19.0.0/node_modules/react-inspector/dist/index.mjs
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -20,1430 +21,1147 @@ var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+	return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
 };
 var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
 };
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(!mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
-var require_is_object = __commonJS({
-  "node_modules/is-object/index.js"(exports, module) {
-    module.exports = function isObject(x) {
-      return typeof x === "object" && x !== null;
-    };
-  }
-});
-var require_is_window = __commonJS({
-  "node_modules/is-window/index.js"(exports, module) {
-    module.exports = function(obj) {
-      if (obj == null) {
-        return false;
-      }
-      var o = Object(obj);
-      return o === o.window;
-    };
-  }
-});
-var require_is_dom = __commonJS({
-  "node_modules/is-dom/index.js"(exports, module) {
-    var isObject = require_is_object();
-    var isWindow = require_is_window();
-    function isNode(val) {
-      if (!isObject(val) || !isWindow(window) || typeof window.Node !== "function") {
-        return false;
-      }
-      return typeof val.nodeType === "number" && typeof val.nodeName === "string";
-    }
-    module.exports = isNode;
-  }
-});
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+var require_is_object = __commonJS({ "node_modules/is-object/index.js"(exports, module) {
+	"use strict";
+	module.exports = function isObject(x) {
+		return typeof x === "object" && x !== null;
+	};
+} });
+var require_is_window = __commonJS({ "node_modules/is-window/index.js"(exports, module) {
+	"use strict";
+	module.exports = function(obj) {
+		if (obj == null) return false;
+		var o = Object(obj);
+		return o === o.window;
+	};
+} });
+var require_is_dom = __commonJS({ "node_modules/is-dom/index.js"(exports, module) {
+	var isObject = require_is_object();
+	var isWindow = require_is_window();
+	function isNode(val) {
+		if (!isObject(val) || !isWindow(window) || typeof window.Node !== "function") return false;
+		return typeof val.nodeType === "number" && typeof val.nodeName === "string";
+	}
+	module.exports = isNode;
+} });
 var themes_exports = {};
 __export(themes_exports, {
-  chromeDark: () => theme,
-  chromeLight: () => theme2
+	chromeDark: () => theme$1,
+	chromeLight: () => theme2
 });
-var theme = {
-  BASE_FONT_FAMILY: "Menlo, monospace",
-  BASE_FONT_SIZE: "11px",
-  BASE_LINE_HEIGHT: 1.2,
-  BASE_BACKGROUND_COLOR: "rgb(36, 36, 36)",
-  BASE_COLOR: "rgb(213, 213, 213)",
-  OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
-  OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
-  OBJECT_NAME_COLOR: "rgb(227, 110, 236)",
-  OBJECT_VALUE_NULL_COLOR: "rgb(127, 127, 127)",
-  OBJECT_VALUE_UNDEFINED_COLOR: "rgb(127, 127, 127)",
-  OBJECT_VALUE_REGEXP_COLOR: "rgb(233, 63, 59)",
-  OBJECT_VALUE_STRING_COLOR: "rgb(233, 63, 59)",
-  OBJECT_VALUE_SYMBOL_COLOR: "rgb(233, 63, 59)",
-  OBJECT_VALUE_NUMBER_COLOR: "hsl(252, 100%, 75%)",
-  OBJECT_VALUE_BOOLEAN_COLOR: "hsl(252, 100%, 75%)",
-  OBJECT_VALUE_FUNCTION_PREFIX_COLOR: "rgb(85, 106, 242)",
-  HTML_TAG_COLOR: "rgb(93, 176, 215)",
-  HTML_TAGNAME_COLOR: "rgb(93, 176, 215)",
-  HTML_TAGNAME_TEXT_TRANSFORM: "lowercase",
-  HTML_ATTRIBUTE_NAME_COLOR: "rgb(155, 187, 220)",
-  HTML_ATTRIBUTE_VALUE_COLOR: "rgb(242, 151, 102)",
-  HTML_COMMENT_COLOR: "rgb(137, 137, 137)",
-  HTML_DOCTYPE_COLOR: "rgb(192, 192, 192)",
-  ARROW_COLOR: "rgb(145, 145, 145)",
-  ARROW_MARGIN_RIGHT: 3,
-  ARROW_FONT_SIZE: 12,
-  ARROW_ANIMATION_DURATION: "0",
-  TREENODE_FONT_FAMILY: "Menlo, monospace",
-  TREENODE_FONT_SIZE: "11px",
-  TREENODE_LINE_HEIGHT: 1.2,
-  TREENODE_PADDING_LEFT: 12,
-  TABLE_BORDER_COLOR: "rgb(85, 85, 85)",
-  TABLE_TH_BACKGROUND_COLOR: "rgb(44, 44, 44)",
-  TABLE_TH_HOVER_COLOR: "rgb(48, 48, 48)",
-  TABLE_SORT_ICON_COLOR: "black",
-  TABLE_DATA_BACKGROUND_IMAGE: "linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 50%, rgba(51, 139, 255, 0.0980392) 50%, rgba(51, 139, 255, 0.0980392))",
-  TABLE_DATA_BACKGROUND_SIZE: "128px 32px"
+var theme$1 = {
+	BASE_FONT_FAMILY: "Menlo, monospace",
+	BASE_FONT_SIZE: "11px",
+	BASE_LINE_HEIGHT: 1.2,
+	BASE_BACKGROUND_COLOR: "rgb(36, 36, 36)",
+	BASE_COLOR: "rgb(213, 213, 213)",
+	OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
+	OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
+	OBJECT_NAME_COLOR: "rgb(227, 110, 236)",
+	OBJECT_VALUE_NULL_COLOR: "rgb(127, 127, 127)",
+	OBJECT_VALUE_UNDEFINED_COLOR: "rgb(127, 127, 127)",
+	OBJECT_VALUE_REGEXP_COLOR: "rgb(233, 63, 59)",
+	OBJECT_VALUE_STRING_COLOR: "rgb(233, 63, 59)",
+	OBJECT_VALUE_SYMBOL_COLOR: "rgb(233, 63, 59)",
+	OBJECT_VALUE_NUMBER_COLOR: "hsl(252, 100%, 75%)",
+	OBJECT_VALUE_BOOLEAN_COLOR: "hsl(252, 100%, 75%)",
+	OBJECT_VALUE_FUNCTION_PREFIX_COLOR: "rgb(85, 106, 242)",
+	HTML_TAG_COLOR: "rgb(93, 176, 215)",
+	HTML_TAGNAME_COLOR: "rgb(93, 176, 215)",
+	HTML_TAGNAME_TEXT_TRANSFORM: "lowercase",
+	HTML_ATTRIBUTE_NAME_COLOR: "rgb(155, 187, 220)",
+	HTML_ATTRIBUTE_VALUE_COLOR: "rgb(242, 151, 102)",
+	HTML_COMMENT_COLOR: "rgb(137, 137, 137)",
+	HTML_DOCTYPE_COLOR: "rgb(192, 192, 192)",
+	ARROW_COLOR: "rgb(145, 145, 145)",
+	ARROW_MARGIN_RIGHT: 3,
+	ARROW_FONT_SIZE: 12,
+	ARROW_ANIMATION_DURATION: "0",
+	TREENODE_FONT_FAMILY: "Menlo, monospace",
+	TREENODE_FONT_SIZE: "11px",
+	TREENODE_LINE_HEIGHT: 1.2,
+	TREENODE_PADDING_LEFT: 12,
+	TABLE_BORDER_COLOR: "rgb(85, 85, 85)",
+	TABLE_TH_BACKGROUND_COLOR: "rgb(44, 44, 44)",
+	TABLE_TH_HOVER_COLOR: "rgb(48, 48, 48)",
+	TABLE_SORT_ICON_COLOR: "black",
+	TABLE_DATA_BACKGROUND_IMAGE: "linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 50%, rgba(51, 139, 255, 0.0980392) 50%, rgba(51, 139, 255, 0.0980392))",
+	TABLE_DATA_BACKGROUND_SIZE: "128px 32px"
 };
 var theme2 = {
-  BASE_FONT_FAMILY: "Menlo, monospace",
-  BASE_FONT_SIZE: "11px",
-  BASE_LINE_HEIGHT: 1.2,
-  BASE_BACKGROUND_COLOR: "white",
-  BASE_COLOR: "black",
-  OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
-  OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
-  OBJECT_NAME_COLOR: "rgb(136, 19, 145)",
-  OBJECT_VALUE_NULL_COLOR: "rgb(128, 128, 128)",
-  OBJECT_VALUE_UNDEFINED_COLOR: "rgb(128, 128, 128)",
-  OBJECT_VALUE_REGEXP_COLOR: "rgb(196, 26, 22)",
-  OBJECT_VALUE_STRING_COLOR: "rgb(196, 26, 22)",
-  OBJECT_VALUE_SYMBOL_COLOR: "rgb(196, 26, 22)",
-  OBJECT_VALUE_NUMBER_COLOR: "rgb(28, 0, 207)",
-  OBJECT_VALUE_BOOLEAN_COLOR: "rgb(28, 0, 207)",
-  OBJECT_VALUE_FUNCTION_PREFIX_COLOR: "rgb(13, 34, 170)",
-  HTML_TAG_COLOR: "rgb(168, 148, 166)",
-  HTML_TAGNAME_COLOR: "rgb(136, 18, 128)",
-  HTML_TAGNAME_TEXT_TRANSFORM: "lowercase",
-  HTML_ATTRIBUTE_NAME_COLOR: "rgb(153, 69, 0)",
-  HTML_ATTRIBUTE_VALUE_COLOR: "rgb(26, 26, 166)",
-  HTML_COMMENT_COLOR: "rgb(35, 110, 37)",
-  HTML_DOCTYPE_COLOR: "rgb(192, 192, 192)",
-  ARROW_COLOR: "#6e6e6e",
-  ARROW_MARGIN_RIGHT: 3,
-  ARROW_FONT_SIZE: 12,
-  ARROW_ANIMATION_DURATION: "0",
-  TREENODE_FONT_FAMILY: "Menlo, monospace",
-  TREENODE_FONT_SIZE: "11px",
-  TREENODE_LINE_HEIGHT: 1.2,
-  TREENODE_PADDING_LEFT: 12,
-  TABLE_BORDER_COLOR: "#aaa",
-  TABLE_TH_BACKGROUND_COLOR: "#eee",
-  TABLE_TH_HOVER_COLOR: "hsla(0, 0%, 90%, 1)",
-  TABLE_SORT_ICON_COLOR: "#6e6e6e",
-  TABLE_DATA_BACKGROUND_IMAGE: "linear-gradient(to bottom, white, white 50%, rgb(234, 243, 255) 50%, rgb(234, 243, 255))",
-  TABLE_DATA_BACKGROUND_SIZE: "128px 32px"
+	BASE_FONT_FAMILY: "Menlo, monospace",
+	BASE_FONT_SIZE: "11px",
+	BASE_LINE_HEIGHT: 1.2,
+	BASE_BACKGROUND_COLOR: "white",
+	BASE_COLOR: "black",
+	OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
+	OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
+	OBJECT_NAME_COLOR: "rgb(136, 19, 145)",
+	OBJECT_VALUE_NULL_COLOR: "rgb(128, 128, 128)",
+	OBJECT_VALUE_UNDEFINED_COLOR: "rgb(128, 128, 128)",
+	OBJECT_VALUE_REGEXP_COLOR: "rgb(196, 26, 22)",
+	OBJECT_VALUE_STRING_COLOR: "rgb(196, 26, 22)",
+	OBJECT_VALUE_SYMBOL_COLOR: "rgb(196, 26, 22)",
+	OBJECT_VALUE_NUMBER_COLOR: "rgb(28, 0, 207)",
+	OBJECT_VALUE_BOOLEAN_COLOR: "rgb(28, 0, 207)",
+	OBJECT_VALUE_FUNCTION_PREFIX_COLOR: "rgb(13, 34, 170)",
+	HTML_TAG_COLOR: "rgb(168, 148, 166)",
+	HTML_TAGNAME_COLOR: "rgb(136, 18, 128)",
+	HTML_TAGNAME_TEXT_TRANSFORM: "lowercase",
+	HTML_ATTRIBUTE_NAME_COLOR: "rgb(153, 69, 0)",
+	HTML_ATTRIBUTE_VALUE_COLOR: "rgb(26, 26, 166)",
+	HTML_COMMENT_COLOR: "rgb(35, 110, 37)",
+	HTML_DOCTYPE_COLOR: "rgb(192, 192, 192)",
+	ARROW_COLOR: "#6e6e6e",
+	ARROW_MARGIN_RIGHT: 3,
+	ARROW_FONT_SIZE: 12,
+	ARROW_ANIMATION_DURATION: "0",
+	TREENODE_FONT_FAMILY: "Menlo, monospace",
+	TREENODE_FONT_SIZE: "11px",
+	TREENODE_LINE_HEIGHT: 1.2,
+	TREENODE_PADDING_LEFT: 12,
+	TABLE_BORDER_COLOR: "#aaa",
+	TABLE_TH_BACKGROUND_COLOR: "#eee",
+	TABLE_TH_HOVER_COLOR: "hsla(0, 0%, 90%, 1)",
+	TABLE_SORT_ICON_COLOR: "#6e6e6e",
+	TABLE_DATA_BACKGROUND_IMAGE: "linear-gradient(to bottom, white, white 50%, rgb(234, 243, 255) 50%, rgb(234, 243, 255))",
+	TABLE_DATA_BACKGROUND_SIZE: "128px 32px"
 };
-var ExpandedPathsContext = createContext([{}, () => {
-}]);
+var ExpandedPathsContext = createContext([{}, () => {}]);
 var unselectable = {
-  WebkitTouchCallout: "none",
-  WebkitUserSelect: "none",
-  KhtmlUserSelect: "none",
-  MozUserSelect: "none",
-  msUserSelect: "none",
-  OUserSelect: "none",
-  userSelect: "none"
+	WebkitTouchCallout: "none",
+	WebkitUserSelect: "none",
+	KhtmlUserSelect: "none",
+	MozUserSelect: "none",
+	msUserSelect: "none",
+	OUserSelect: "none",
+	userSelect: "none"
 };
-var createTheme = (theme32) => ({
-  DOMNodePreview: {
-    htmlOpenTag: {
-      base: {
-        color: theme32.HTML_TAG_COLOR
-      },
-      tagName: {
-        color: theme32.HTML_TAGNAME_COLOR,
-        textTransform: theme32.HTML_TAGNAME_TEXT_TRANSFORM
-      },
-      htmlAttributeName: {
-        color: theme32.HTML_ATTRIBUTE_NAME_COLOR
-      },
-      htmlAttributeValue: {
-        color: theme32.HTML_ATTRIBUTE_VALUE_COLOR
-      }
-    },
-    htmlCloseTag: {
-      base: {
-        color: theme32.HTML_TAG_COLOR
-      },
-      offsetLeft: {
-        marginLeft: -theme32.TREENODE_PADDING_LEFT
-      },
-      tagName: {
-        color: theme32.HTML_TAGNAME_COLOR,
-        textTransform: theme32.HTML_TAGNAME_TEXT_TRANSFORM
-      }
-    },
-    htmlComment: {
-      color: theme32.HTML_COMMENT_COLOR
-    },
-    htmlDoctype: {
-      color: theme32.HTML_DOCTYPE_COLOR
-    }
-  },
-  ObjectPreview: {
-    objectDescription: {
-      fontStyle: "italic"
-    },
-    preview: {
-      fontStyle: "italic"
-    },
-    arrayMaxProperties: theme32.OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES,
-    objectMaxProperties: theme32.OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES
-  },
-  ObjectName: {
-    base: {
-      color: theme32.OBJECT_NAME_COLOR
-    },
-    dimmed: {
-      opacity: 0.6
-    }
-  },
-  ObjectValue: {
-    objectValueNull: {
-      color: theme32.OBJECT_VALUE_NULL_COLOR
-    },
-    objectValueUndefined: {
-      color: theme32.OBJECT_VALUE_UNDEFINED_COLOR
-    },
-    objectValueRegExp: {
-      color: theme32.OBJECT_VALUE_REGEXP_COLOR
-    },
-    objectValueString: {
-      color: theme32.OBJECT_VALUE_STRING_COLOR
-    },
-    objectValueSymbol: {
-      color: theme32.OBJECT_VALUE_SYMBOL_COLOR
-    },
-    objectValueNumber: {
-      color: theme32.OBJECT_VALUE_NUMBER_COLOR
-    },
-    objectValueBoolean: {
-      color: theme32.OBJECT_VALUE_BOOLEAN_COLOR
-    },
-    objectValueFunctionPrefix: {
-      color: theme32.OBJECT_VALUE_FUNCTION_PREFIX_COLOR,
-      fontStyle: "italic"
-    },
-    objectValueFunctionName: {
-      fontStyle: "italic"
-    }
-  },
-  TreeView: {
-    treeViewOutline: {
-      padding: 0,
-      margin: 0,
-      listStyleType: "none"
-    }
-  },
-  TreeNode: {
-    treeNodeBase: {
-      color: theme32.BASE_COLOR,
-      backgroundColor: theme32.BASE_BACKGROUND_COLOR,
-      lineHeight: theme32.TREENODE_LINE_HEIGHT,
-      cursor: "default",
-      boxSizing: "border-box",
-      listStyle: "none",
-      fontFamily: theme32.TREENODE_FONT_FAMILY,
-      fontSize: theme32.TREENODE_FONT_SIZE
-    },
-    treeNodePreviewContainer: {},
-    treeNodePlaceholder: {
-      whiteSpace: "pre",
-      fontSize: theme32.ARROW_FONT_SIZE,
-      marginRight: theme32.ARROW_MARGIN_RIGHT,
-      ...unselectable
-    },
-    treeNodeArrow: {
-      base: {
-        color: theme32.ARROW_COLOR,
-        display: "inline-block",
-        fontSize: theme32.ARROW_FONT_SIZE,
-        marginRight: theme32.ARROW_MARGIN_RIGHT,
-        ...parseFloat(theme32.ARROW_ANIMATION_DURATION) > 0 ? {
-          transition: `transform ${theme32.ARROW_ANIMATION_DURATION} ease 0s`
-        } : {},
-        ...unselectable
-      },
-      expanded: {
-        WebkitTransform: "rotateZ(90deg)",
-        MozTransform: "rotateZ(90deg)",
-        transform: "rotateZ(90deg)"
-      },
-      collapsed: {
-        WebkitTransform: "rotateZ(0deg)",
-        MozTransform: "rotateZ(0deg)",
-        transform: "rotateZ(0deg)"
-      }
-    },
-    treeNodeChildNodesContainer: {
-      margin: 0,
-      paddingLeft: theme32.TREENODE_PADDING_LEFT
-    }
-  },
-  TableInspector: {
-    base: {
-      color: theme32.BASE_COLOR,
-      position: "relative",
-      border: `1px solid ${theme32.TABLE_BORDER_COLOR}`,
-      fontFamily: theme32.BASE_FONT_FAMILY,
-      fontSize: theme32.BASE_FONT_SIZE,
-      lineHeight: "120%",
-      boxSizing: "border-box",
-      cursor: "default"
-    }
-  },
-  TableInspectorHeaderContainer: {
-    base: {
-      top: 0,
-      height: "17px",
-      left: 0,
-      right: 0,
-      overflowX: "hidden"
-    },
-    table: {
-      tableLayout: "fixed",
-      borderSpacing: 0,
-      borderCollapse: "separate",
-      height: "100%",
-      width: "100%",
-      margin: 0
-    }
-  },
-  TableInspectorDataContainer: {
-    tr: {
-      display: "table-row"
-    },
-    td: {
-      boxSizing: "border-box",
-      border: "none",
-      height: "16px",
-      verticalAlign: "top",
-      padding: "1px 4px",
-      WebkitUserSelect: "text",
-      whiteSpace: "nowrap",
-      textOverflow: "ellipsis",
-      overflow: "hidden",
-      lineHeight: "14px"
-    },
-    div: {
-      position: "static",
-      top: "17px",
-      bottom: 0,
-      overflowY: "overlay",
-      transform: "translateZ(0)",
-      left: 0,
-      right: 0,
-      overflowX: "hidden"
-    },
-    table: {
-      positon: "static",
-      left: 0,
-      top: 0,
-      right: 0,
-      bottom: 0,
-      borderTop: "0 none transparent",
-      margin: 0,
-      backgroundImage: theme32.TABLE_DATA_BACKGROUND_IMAGE,
-      backgroundSize: theme32.TABLE_DATA_BACKGROUND_SIZE,
-      tableLayout: "fixed",
-      borderSpacing: 0,
-      borderCollapse: "separate",
-      width: "100%",
-      fontSize: theme32.BASE_FONT_SIZE,
-      lineHeight: "120%"
-    }
-  },
-  TableInspectorTH: {
-    base: {
-      position: "relative",
-      height: "auto",
-      textAlign: "left",
-      backgroundColor: theme32.TABLE_TH_BACKGROUND_COLOR,
-      borderBottom: `1px solid ${theme32.TABLE_BORDER_COLOR}`,
-      fontWeight: "normal",
-      verticalAlign: "middle",
-      padding: "0 4px",
-      whiteSpace: "nowrap",
-      textOverflow: "ellipsis",
-      overflow: "hidden",
-      lineHeight: "14px",
-      ":hover": {
-        backgroundColor: theme32.TABLE_TH_HOVER_COLOR
-      }
-    },
-    div: {
-      whiteSpace: "nowrap",
-      textOverflow: "ellipsis",
-      overflow: "hidden",
-      fontSize: theme32.BASE_FONT_SIZE,
-      lineHeight: "120%"
-    }
-  },
-  TableInspectorLeftBorder: {
-    none: {
-      borderLeft: "none"
-    },
-    solid: {
-      borderLeft: `1px solid ${theme32.TABLE_BORDER_COLOR}`
-    }
-  },
-  TableInspectorSortIcon: {
-    display: "block",
-    marginRight: 3,
-    width: 8,
-    height: 7,
-    marginTop: -7,
-    color: theme32.TABLE_SORT_ICON_COLOR,
-    fontSize: 12,
-    ...unselectable
-  }
+var createTheme = (theme3) => ({
+	DOMNodePreview: {
+		htmlOpenTag: {
+			base: { color: theme3.HTML_TAG_COLOR },
+			tagName: {
+				color: theme3.HTML_TAGNAME_COLOR,
+				textTransform: theme3.HTML_TAGNAME_TEXT_TRANSFORM
+			},
+			htmlAttributeName: { color: theme3.HTML_ATTRIBUTE_NAME_COLOR },
+			htmlAttributeValue: { color: theme3.HTML_ATTRIBUTE_VALUE_COLOR }
+		},
+		htmlCloseTag: {
+			base: { color: theme3.HTML_TAG_COLOR },
+			offsetLeft: { marginLeft: -theme3.TREENODE_PADDING_LEFT },
+			tagName: {
+				color: theme3.HTML_TAGNAME_COLOR,
+				textTransform: theme3.HTML_TAGNAME_TEXT_TRANSFORM
+			}
+		},
+		htmlComment: { color: theme3.HTML_COMMENT_COLOR },
+		htmlDoctype: { color: theme3.HTML_DOCTYPE_COLOR }
+	},
+	ObjectPreview: {
+		objectDescription: { fontStyle: "italic" },
+		preview: { fontStyle: "italic" },
+		arrayMaxProperties: theme3.OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES,
+		objectMaxProperties: theme3.OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES
+	},
+	ObjectName: {
+		base: { color: theme3.OBJECT_NAME_COLOR },
+		dimmed: { opacity: .6 }
+	},
+	ObjectValue: {
+		objectValueNull: { color: theme3.OBJECT_VALUE_NULL_COLOR },
+		objectValueUndefined: { color: theme3.OBJECT_VALUE_UNDEFINED_COLOR },
+		objectValueRegExp: { color: theme3.OBJECT_VALUE_REGEXP_COLOR },
+		objectValueString: { color: theme3.OBJECT_VALUE_STRING_COLOR },
+		objectValueSymbol: { color: theme3.OBJECT_VALUE_SYMBOL_COLOR },
+		objectValueNumber: { color: theme3.OBJECT_VALUE_NUMBER_COLOR },
+		objectValueBoolean: { color: theme3.OBJECT_VALUE_BOOLEAN_COLOR },
+		objectValueFunctionPrefix: {
+			color: theme3.OBJECT_VALUE_FUNCTION_PREFIX_COLOR,
+			fontStyle: "italic"
+		},
+		objectValueFunctionName: { fontStyle: "italic" }
+	},
+	TreeView: { treeViewOutline: {
+		padding: 0,
+		margin: 0,
+		listStyleType: "none"
+	} },
+	TreeNode: {
+		treeNodeBase: {
+			color: theme3.BASE_COLOR,
+			backgroundColor: theme3.BASE_BACKGROUND_COLOR,
+			lineHeight: theme3.TREENODE_LINE_HEIGHT,
+			cursor: "default",
+			boxSizing: "border-box",
+			listStyle: "none",
+			fontFamily: theme3.TREENODE_FONT_FAMILY,
+			fontSize: theme3.TREENODE_FONT_SIZE
+		},
+		treeNodePreviewContainer: {},
+		treeNodePlaceholder: {
+			whiteSpace: "pre",
+			fontSize: theme3.ARROW_FONT_SIZE,
+			marginRight: theme3.ARROW_MARGIN_RIGHT,
+			...unselectable
+		},
+		treeNodeArrow: {
+			base: {
+				color: theme3.ARROW_COLOR,
+				display: "inline-block",
+				fontSize: theme3.ARROW_FONT_SIZE,
+				marginRight: theme3.ARROW_MARGIN_RIGHT,
+				...parseFloat(theme3.ARROW_ANIMATION_DURATION) > 0 ? { transition: `transform ${theme3.ARROW_ANIMATION_DURATION} ease 0s` } : {},
+				...unselectable
+			},
+			expanded: {
+				WebkitTransform: "rotateZ(90deg)",
+				MozTransform: "rotateZ(90deg)",
+				transform: "rotateZ(90deg)"
+			},
+			collapsed: {
+				WebkitTransform: "rotateZ(0deg)",
+				MozTransform: "rotateZ(0deg)",
+				transform: "rotateZ(0deg)"
+			}
+		},
+		treeNodeChildNodesContainer: {
+			margin: 0,
+			paddingLeft: theme3.TREENODE_PADDING_LEFT
+		}
+	},
+	TableInspector: { base: {
+		color: theme3.BASE_COLOR,
+		position: "relative",
+		border: `1px solid ${theme3.TABLE_BORDER_COLOR}`,
+		fontFamily: theme3.BASE_FONT_FAMILY,
+		fontSize: theme3.BASE_FONT_SIZE,
+		lineHeight: "120%",
+		boxSizing: "border-box",
+		cursor: "default"
+	} },
+	TableInspectorHeaderContainer: {
+		base: {
+			top: 0,
+			height: "17px",
+			left: 0,
+			right: 0,
+			overflowX: "hidden"
+		},
+		table: {
+			tableLayout: "fixed",
+			borderSpacing: 0,
+			borderCollapse: "separate",
+			height: "100%",
+			width: "100%",
+			margin: 0
+		}
+	},
+	TableInspectorDataContainer: {
+		tr: { display: "table-row" },
+		td: {
+			boxSizing: "border-box",
+			border: "none",
+			height: "16px",
+			verticalAlign: "top",
+			padding: "1px 4px",
+			WebkitUserSelect: "text",
+			whiteSpace: "nowrap",
+			textOverflow: "ellipsis",
+			overflow: "hidden",
+			lineHeight: "14px"
+		},
+		div: {
+			position: "static",
+			top: "17px",
+			bottom: 0,
+			overflowY: "overlay",
+			transform: "translateZ(0)",
+			left: 0,
+			right: 0,
+			overflowX: "hidden"
+		},
+		table: {
+			positon: "static",
+			left: 0,
+			top: 0,
+			right: 0,
+			bottom: 0,
+			borderTop: "0 none transparent",
+			margin: 0,
+			backgroundImage: theme3.TABLE_DATA_BACKGROUND_IMAGE,
+			backgroundSize: theme3.TABLE_DATA_BACKGROUND_SIZE,
+			tableLayout: "fixed",
+			borderSpacing: 0,
+			borderCollapse: "separate",
+			width: "100%",
+			fontSize: theme3.BASE_FONT_SIZE,
+			lineHeight: "120%"
+		}
+	},
+	TableInspectorTH: {
+		base: {
+			position: "relative",
+			height: "auto",
+			textAlign: "left",
+			backgroundColor: theme3.TABLE_TH_BACKGROUND_COLOR,
+			borderBottom: `1px solid ${theme3.TABLE_BORDER_COLOR}`,
+			fontWeight: "normal",
+			verticalAlign: "middle",
+			padding: "0 4px",
+			whiteSpace: "nowrap",
+			textOverflow: "ellipsis",
+			overflow: "hidden",
+			lineHeight: "14px",
+			":hover": { backgroundColor: theme3.TABLE_TH_HOVER_COLOR }
+		},
+		div: {
+			whiteSpace: "nowrap",
+			textOverflow: "ellipsis",
+			overflow: "hidden",
+			fontSize: theme3.BASE_FONT_SIZE,
+			lineHeight: "120%"
+		}
+	},
+	TableInspectorLeftBorder: {
+		none: { borderLeft: "none" },
+		solid: { borderLeft: `1px solid ${theme3.TABLE_BORDER_COLOR}` }
+	},
+	TableInspectorSortIcon: {
+		display: "block",
+		marginRight: 3,
+		width: 8,
+		height: 7,
+		marginTop: -7,
+		color: theme3.TABLE_SORT_ICON_COLOR,
+		fontSize: 12,
+		...unselectable
+	}
 });
 var DEFAULT_THEME_NAME = "chromeLight";
 var ThemeContext = createContext(createTheme(themes_exports[DEFAULT_THEME_NAME]));
 var useStyles = (baseStylesKey) => {
-  const themeStyles = useContext(ThemeContext);
-  return themeStyles[baseStylesKey];
+	const themeStyles = useContext(ThemeContext);
+	return themeStyles[baseStylesKey];
 };
 var themeAcceptor = (WrappedComponent) => {
-  const ThemeAcceptor = ({ theme: theme32 = DEFAULT_THEME_NAME, ...restProps }) => {
-    const themeStyles = useMemo(() => {
-      switch (Object.prototype.toString.call(theme32)) {
-        case "[object String]":
-          return createTheme(themes_exports[theme32]);
-        case "[object Object]":
-          return createTheme(theme32);
-        default:
-          return createTheme(themes_exports[DEFAULT_THEME_NAME]);
-      }
-    }, [theme32]);
-    return /* @__PURE__ */ React14.createElement(ThemeContext.Provider, {
-      value: themeStyles
-    }, /* @__PURE__ */ React14.createElement(WrappedComponent, {
-      ...restProps
-    }));
-  };
-  return ThemeAcceptor;
+	const ThemeAcceptor = ({ theme: theme3 = DEFAULT_THEME_NAME,...restProps }) => {
+		const themeStyles = useMemo(() => {
+			switch (Object.prototype.toString.call(theme3)) {
+				case "[object String]": return createTheme(themes_exports[theme3]);
+				case "[object Object]": return createTheme(theme3);
+				default: return createTheme(themes_exports[DEFAULT_THEME_NAME]);
+			}
+		}, [theme3]);
+		return /* @__PURE__ */ React.createElement(ThemeContext.Provider, { value: themeStyles }, /* @__PURE__ */ React.createElement(WrappedComponent, { ...restProps }));
+	};
+	return ThemeAcceptor;
 };
-var Arrow = ({ expanded, styles }) => /* @__PURE__ */ React14.createElement("span", {
-  style: {
-    ...styles.base,
-    ...expanded ? styles.expanded : styles.collapsed
-  }
-}, "\u25B6");
+var Arrow = ({ expanded, styles }) => /* @__PURE__ */ React.createElement("span", { style: {
+	...styles.base,
+	...expanded ? styles.expanded : styles.collapsed
+} }, "▶");
 var TreeNode = memo((props) => {
-  props = {
-    expanded: true,
-    nodeRenderer: ({ name }) => /* @__PURE__ */ React14.createElement("span", null, name),
-    onClick: () => {
-    },
-    shouldShowArrow: false,
-    shouldShowPlaceholder: true,
-    ...props
-  };
-  const { expanded, onClick, children, nodeRenderer, title, shouldShowArrow, shouldShowPlaceholder } = props;
-  const styles = useStyles("TreeNode");
-  const NodeRenderer = nodeRenderer;
-  return /* @__PURE__ */ React14.createElement("li", {
-    "aria-expanded": expanded,
-    role: "treeitem",
-    style: styles.treeNodeBase,
-    title
-  }, /* @__PURE__ */ React14.createElement("div", {
-    style: styles.treeNodePreviewContainer,
-    onClick
-  }, shouldShowArrow || Children.count(children) > 0 ? /* @__PURE__ */ React14.createElement(Arrow, {
-    expanded,
-    styles: styles.treeNodeArrow
-  }) : shouldShowPlaceholder && /* @__PURE__ */ React14.createElement("span", {
-    style: styles.treeNodePlaceholder
-  }, "\xA0"), /* @__PURE__ */ React14.createElement(NodeRenderer, {
-    ...props
-  })), /* @__PURE__ */ React14.createElement("ol", {
-    role: "group",
-    style: styles.treeNodeChildNodesContainer
-  }, expanded ? children : void 0));
+	props = {
+		expanded: true,
+		nodeRenderer: ({ name }) => /* @__PURE__ */ React.createElement("span", null, name),
+		onClick: () => {},
+		shouldShowArrow: false,
+		shouldShowPlaceholder: true,
+		...props
+	};
+	const { expanded, onClick, children, nodeRenderer, title, shouldShowArrow, shouldShowPlaceholder } = props;
+	const styles = useStyles("TreeNode");
+	const NodeRenderer = nodeRenderer;
+	return /* @__PURE__ */ React.createElement("li", {
+		"aria-expanded": expanded,
+		role: "treeitem",
+		style: styles.treeNodeBase,
+		title
+	}, /* @__PURE__ */ React.createElement("div", {
+		style: styles.treeNodePreviewContainer,
+		onClick
+	}, shouldShowArrow || Children.count(children) > 0 ? /* @__PURE__ */ React.createElement(Arrow, {
+		expanded,
+		styles: styles.treeNodeArrow
+	}) : shouldShowPlaceholder && /* @__PURE__ */ React.createElement("span", { style: styles.treeNodePlaceholder }, "\xA0"), /* @__PURE__ */ React.createElement(NodeRenderer, { ...props })), /* @__PURE__ */ React.createElement("ol", {
+		role: "group",
+		style: styles.treeNodeChildNodesContainer
+	}, expanded ? children : void 0));
 });
 var DEFAULT_ROOT_PATH = "$";
 var WILDCARD = "*";
 function hasChildNodes(data, dataIterator) {
-  return !dataIterator(data).next().done;
+	return !dataIterator(data).next().done;
 }
 var wildcardPathsFromLevel = (level) => {
-  return Array.from({ length: level }, (_, i) => [DEFAULT_ROOT_PATH].concat(Array.from({ length: i }, () => "*")).join("."));
+	return Array.from({ length: level }, (_, i) => [DEFAULT_ROOT_PATH].concat(Array.from({ length: i }, () => "*")).join("."));
 };
 var getExpandedPaths = (data, dataIterator, expandPaths, expandLevel, prevExpandedPaths) => {
-  const wildcardPaths = [].concat(wildcardPathsFromLevel(expandLevel)).concat(expandPaths).filter((path) => typeof path === "string");
-  const expandedPaths = [];
-  wildcardPaths.forEach((wildcardPath) => {
-    const keyPaths = wildcardPath.split(".");
-    const populatePaths = (curData, curPath, depth) => {
-      if (depth === keyPaths.length) {
-        expandedPaths.push(curPath);
-        return;
-      }
-      const key = keyPaths[depth];
-      if (depth === 0) {
-        if (hasChildNodes(curData, dataIterator) && (key === DEFAULT_ROOT_PATH || key === WILDCARD)) {
-          populatePaths(curData, DEFAULT_ROOT_PATH, depth + 1);
-        }
-      } else {
-        if (key === WILDCARD) {
-          for (const { name, data: data2 } of dataIterator(curData)) {
-            if (hasChildNodes(data2, dataIterator)) {
-              populatePaths(data2, `${curPath}.${name}`, depth + 1);
-            }
-          }
-        } else {
-          const value = curData[key];
-          if (hasChildNodes(value, dataIterator)) {
-            populatePaths(value, `${curPath}.${key}`, depth + 1);
-          }
-        }
-      }
-    };
-    populatePaths(data, "", 0);
-  });
-  return expandedPaths.reduce((obj, path) => {
-    obj[path] = true;
-    return obj;
-  }, { ...prevExpandedPaths });
+	const wildcardPaths = [].concat(wildcardPathsFromLevel(expandLevel)).concat(expandPaths).filter((path) => typeof path === "string");
+	const expandedPaths = [];
+	wildcardPaths.forEach((wildcardPath) => {
+		const keyPaths = wildcardPath.split(".");
+		const populatePaths = (curData, curPath, depth) => {
+			if (depth === keyPaths.length) {
+				expandedPaths.push(curPath);
+				return;
+			}
+			const key = keyPaths[depth];
+			if (depth === 0) {
+				if (hasChildNodes(curData, dataIterator) && (key === DEFAULT_ROOT_PATH || key === WILDCARD)) populatePaths(curData, DEFAULT_ROOT_PATH, depth + 1);
+			} else if (key === WILDCARD) {
+				for (const { name, data: data2 } of dataIterator(curData)) if (hasChildNodes(data2, dataIterator)) populatePaths(data2, `${curPath}.${name}`, depth + 1);
+			} else {
+				const value = curData[key];
+				if (hasChildNodes(value, dataIterator)) populatePaths(value, `${curPath}.${key}`, depth + 1);
+			}
+		};
+		populatePaths(data, "", 0);
+	});
+	return expandedPaths.reduce((obj, path) => {
+		obj[path] = true;
+		return obj;
+	}, { ...prevExpandedPaths });
 };
 var ConnectedTreeNode = memo((props) => {
-  const { data, dataIterator, path, depth, nodeRenderer } = props;
-  const [expandedPaths, setExpandedPaths] = useContext(ExpandedPathsContext);
-  const nodeHasChildNodes = hasChildNodes(data, dataIterator);
-  const expanded = !!expandedPaths[path];
-  const handleClick = useCallback(() => nodeHasChildNodes && setExpandedPaths((prevExpandedPaths) => ({
-    ...prevExpandedPaths,
-    [path]: !expanded
-  })), [nodeHasChildNodes, setExpandedPaths, path, expanded]);
-  return /* @__PURE__ */ React14.createElement(TreeNode, {
-    expanded,
-    onClick: handleClick,
-    shouldShowArrow: nodeHasChildNodes,
-    shouldShowPlaceholder: depth > 0,
-    nodeRenderer,
-    ...props
-  }, expanded ? [...dataIterator(data)].map(({ name, data: data2, ...renderNodeProps }) => {
-    return /* @__PURE__ */ React14.createElement(ConnectedTreeNode, {
-      name,
-      data: data2,
-      depth: depth + 1,
-      path: `${path}.${name}`,
-      key: name,
-      dataIterator,
-      nodeRenderer,
-      ...renderNodeProps
-    });
-  }) : null);
+	const { data, dataIterator, path, depth, nodeRenderer } = props;
+	const [expandedPaths, setExpandedPaths] = useContext(ExpandedPathsContext);
+	const nodeHasChildNodes = hasChildNodes(data, dataIterator);
+	const expanded = !!expandedPaths[path];
+	const handleClick = useCallback(() => nodeHasChildNodes && setExpandedPaths((prevExpandedPaths) => ({
+		...prevExpandedPaths,
+		[path]: !expanded
+	})), [
+		nodeHasChildNodes,
+		setExpandedPaths,
+		path,
+		expanded
+	]);
+	return /* @__PURE__ */ React.createElement(TreeNode, {
+		expanded,
+		onClick: handleClick,
+		shouldShowArrow: nodeHasChildNodes,
+		shouldShowPlaceholder: depth > 0,
+		nodeRenderer,
+		...props
+	}, expanded ? [...dataIterator(data)].map(({ name, data: data2,...renderNodeProps }) => {
+		return /* @__PURE__ */ React.createElement(ConnectedTreeNode, {
+			name,
+			data: data2,
+			depth: depth + 1,
+			path: `${path}.${name}`,
+			key: name,
+			dataIterator,
+			nodeRenderer,
+			...renderNodeProps
+		});
+	}) : null);
 });
 var TreeView = memo(({ name, data, dataIterator, nodeRenderer, expandPaths, expandLevel }) => {
-  const styles = useStyles("TreeView");
-  const stateAndSetter = useState({});
-  const [, setExpandedPaths] = stateAndSetter;
-  useLayoutEffect(() => setExpandedPaths((prevExpandedPaths) => getExpandedPaths(data, dataIterator, expandPaths, expandLevel, prevExpandedPaths)), [data, dataIterator, expandPaths, expandLevel]);
-  return /* @__PURE__ */ React14.createElement(ExpandedPathsContext.Provider, {
-    value: stateAndSetter
-  }, /* @__PURE__ */ React14.createElement("ol", {
-    role: "tree",
-    style: styles.treeViewOutline
-  }, /* @__PURE__ */ React14.createElement(ConnectedTreeNode, {
-    name,
-    data,
-    dataIterator,
-    depth: 0,
-    path: DEFAULT_ROOT_PATH,
-    nodeRenderer
-  })));
+	const styles = useStyles("TreeView");
+	const stateAndSetter = useState({});
+	const [, setExpandedPaths] = stateAndSetter;
+	useLayoutEffect(() => setExpandedPaths((prevExpandedPaths) => getExpandedPaths(data, dataIterator, expandPaths, expandLevel, prevExpandedPaths)), [
+		data,
+		dataIterator,
+		expandPaths,
+		expandLevel
+	]);
+	return /* @__PURE__ */ React.createElement(ExpandedPathsContext.Provider, { value: stateAndSetter }, /* @__PURE__ */ React.createElement("ol", {
+		role: "tree",
+		style: styles.treeViewOutline
+	}, /* @__PURE__ */ React.createElement(ConnectedTreeNode, {
+		name,
+		data,
+		dataIterator,
+		depth: 0,
+		path: DEFAULT_ROOT_PATH,
+		nodeRenderer
+	})));
 });
 var ObjectName = ({ name, dimmed = false, styles = {} }) => {
-  const themeStyles = useStyles("ObjectName");
-  const appliedStyles = {
-    ...themeStyles.base,
-    ...dimmed ? themeStyles["dimmed"] : {},
-    ...styles
-  };
-  return /* @__PURE__ */ React14.createElement("span", {
-    style: appliedStyles
-  }, name);
+	const themeStyles = useStyles("ObjectName");
+	const appliedStyles = {
+		...themeStyles.base,
+		...dimmed ? themeStyles["dimmed"] : {},
+		...styles
+	};
+	return /* @__PURE__ */ React.createElement("span", { style: appliedStyles }, name);
 };
 var ObjectValue = ({ object, styles }) => {
-  const themeStyles = useStyles("ObjectValue");
-  const mkStyle = (key) => ({ ...themeStyles[key], ...styles });
-  switch (typeof object) {
-    case "bigint":
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueNumber")
-      }, String(object), "n");
-    case "number":
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueNumber")
-      }, String(object));
-    case "string":
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueString")
-      }, '"', object, '"');
-    case "boolean":
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueBoolean")
-      }, String(object));
-    case "undefined":
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueUndefined")
-      }, "undefined");
-    case "object":
-      if (object === null) {
-        return /* @__PURE__ */ React14.createElement("span", {
-          style: mkStyle("objectValueNull")
-        }, "null");
-      }
-      if (object instanceof Date) {
-        return /* @__PURE__ */ React14.createElement("span", null, object.toString());
-      }
-      if (object instanceof RegExp) {
-        return /* @__PURE__ */ React14.createElement("span", {
-          style: mkStyle("objectValueRegExp")
-        }, object.toString());
-      }
-      if (Array.isArray(object)) {
-        return /* @__PURE__ */ React14.createElement("span", null, `Array(${object.length})`);
-      }
-      if (!object.constructor) {
-        return /* @__PURE__ */ React14.createElement("span", null, "Object");
-      }
-      if (typeof object.constructor.isBuffer === "function" && object.constructor.isBuffer(object)) {
-        return /* @__PURE__ */ React14.createElement("span", null, `Buffer[${object.length}]`);
-      }
-      return /* @__PURE__ */ React14.createElement("span", null, object.constructor.name);
-    case "function":
-      return /* @__PURE__ */ React14.createElement("span", null, /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueFunctionPrefix")
-      }, "\u0192\xA0"), /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueFunctionName")
-      }, object.name, "()"));
-    case "symbol":
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: mkStyle("objectValueSymbol")
-      }, object.toString());
-    default:
-      return /* @__PURE__ */ React14.createElement("span", null);
-  }
+	const themeStyles = useStyles("ObjectValue");
+	const mkStyle = (key) => ({
+		...themeStyles[key],
+		...styles
+	});
+	switch (typeof object) {
+		case "bigint": return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueNumber") }, String(object), "n");
+		case "number": return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueNumber") }, String(object));
+		case "string": return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueString") }, "\"", object, "\"");
+		case "boolean": return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueBoolean") }, String(object));
+		case "undefined": return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueUndefined") }, "undefined");
+		case "object":
+			if (object === null) return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueNull") }, "null");
+			if (object instanceof Date) return /* @__PURE__ */ React.createElement("span", null, object.toString());
+			if (object instanceof RegExp) return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueRegExp") }, object.toString());
+			if (Array.isArray(object)) return /* @__PURE__ */ React.createElement("span", null, `Array(${object.length})`);
+			if (!object.constructor) return /* @__PURE__ */ React.createElement("span", null, "Object");
+			if (typeof object.constructor.isBuffer === "function" && object.constructor.isBuffer(object)) return /* @__PURE__ */ React.createElement("span", null, `Buffer[${object.length}]`);
+			return /* @__PURE__ */ React.createElement("span", null, object.constructor.name);
+		case "function": return /* @__PURE__ */ React.createElement("span", null, /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueFunctionPrefix") }, "ƒ\xA0"), /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueFunctionName") }, object.name, "()"));
+		case "symbol": return /* @__PURE__ */ React.createElement("span", { style: mkStyle("objectValueSymbol") }, object.toString());
+		default: return /* @__PURE__ */ React.createElement("span", null);
+	}
 };
 var hasOwnProperty = Object.prototype.hasOwnProperty;
 var propertyIsEnumerable = Object.prototype.propertyIsEnumerable;
 function getPropertyValue(object, propertyName) {
-  const propertyDescriptor = Object.getOwnPropertyDescriptor(object, propertyName);
-  if (propertyDescriptor.get) {
-    try {
-      return propertyDescriptor.get();
-    } catch {
-      return propertyDescriptor.get;
-    }
-  }
-  return object[propertyName];
+	const propertyDescriptor = Object.getOwnPropertyDescriptor(object, propertyName);
+	if (propertyDescriptor.get) try {
+		return propertyDescriptor.get();
+	} catch {
+		return propertyDescriptor.get;
+	}
+	return object[propertyName];
 }
 function intersperse(arr, sep) {
-  if (arr.length === 0) {
-    return [];
-  }
-  return arr.slice(1).reduce((xs, x) => xs.concat([sep, x]), [arr[0]]);
+	if (arr.length === 0) return [];
+	return arr.slice(1).reduce((xs, x) => xs.concat([sep, x]), [arr[0]]);
 }
 var ObjectPreview = ({ data }) => {
-  const styles = useStyles("ObjectPreview");
-  const object = data;
-  if (typeof object !== "object" || object === null || object instanceof Date || object instanceof RegExp) {
-    return /* @__PURE__ */ React14.createElement(ObjectValue, {
-      object
-    });
-  }
-  if (Array.isArray(object)) {
-    const maxProperties = styles.arrayMaxProperties;
-    const previewArray = object.slice(0, maxProperties).map((element, index) => /* @__PURE__ */ React14.createElement(ObjectValue, {
-      key: index,
-      object: element
-    }));
-    if (object.length > maxProperties) {
-      previewArray.push(/* @__PURE__ */ React14.createElement("span", {
-        key: "ellipsis"
-      }, "\u2026"));
-    }
-    const arrayLength = object.length;
-    return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement("span", {
-      style: styles.objectDescription
-    }, arrayLength === 0 ? `` : `(${arrayLength})\xA0`), /* @__PURE__ */ React14.createElement("span", {
-      style: styles.preview
-    }, "[", intersperse(previewArray, ", "), "]"));
-  } else {
-    const maxProperties = styles.objectMaxProperties;
-    const propertyNodes = [];
-    for (const propertyName in object) {
-      if (hasOwnProperty.call(object, propertyName)) {
-        let ellipsis;
-        if (propertyNodes.length === maxProperties - 1 && Object.keys(object).length > maxProperties) {
-          ellipsis = /* @__PURE__ */ React14.createElement("span", {
-            key: "ellipsis"
-          }, "\u2026");
-        }
-        const propertyValue = getPropertyValue(object, propertyName);
-        propertyNodes.push(/* @__PURE__ */ React14.createElement("span", {
-          key: propertyName
-        }, /* @__PURE__ */ React14.createElement(ObjectName, {
-          name: propertyName || `""`
-        }), ":\xA0", /* @__PURE__ */ React14.createElement(ObjectValue, {
-          object: propertyValue
-        }), ellipsis));
-        if (ellipsis)
-          break;
-      }
-    }
-    const objectConstructorName = object.constructor ? object.constructor.name : "Object";
-    return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement("span", {
-      style: styles.objectDescription
-    }, objectConstructorName === "Object" ? "" : `${objectConstructorName} `), /* @__PURE__ */ React14.createElement("span", {
-      style: styles.preview
-    }, "{", intersperse(propertyNodes, ", "), "}"));
-  }
+	const styles = useStyles("ObjectPreview");
+	const object = data;
+	if (typeof object !== "object" || object === null || object instanceof Date || object instanceof RegExp) return /* @__PURE__ */ React.createElement(ObjectValue, { object });
+	if (Array.isArray(object)) {
+		const maxProperties = styles.arrayMaxProperties;
+		const previewArray = object.slice(0, maxProperties).map((element, index) => /* @__PURE__ */ React.createElement(ObjectValue, {
+			key: index,
+			object: element
+		}));
+		if (object.length > maxProperties) previewArray.push(/* @__PURE__ */ React.createElement("span", { key: "ellipsis" }, "…"));
+		const arrayLength = object.length;
+		return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { style: styles.objectDescription }, arrayLength === 0 ? `` : `(${arrayLength})\xA0`), /* @__PURE__ */ React.createElement("span", { style: styles.preview }, "[", intersperse(previewArray, ", "), "]"));
+	} else {
+		const maxProperties = styles.objectMaxProperties;
+		const propertyNodes = [];
+		for (const propertyName in object) if (hasOwnProperty.call(object, propertyName)) {
+			let ellipsis;
+			if (propertyNodes.length === maxProperties - 1 && Object.keys(object).length > maxProperties) ellipsis = /* @__PURE__ */ React.createElement("span", { key: "ellipsis" }, "…");
+			const propertyValue = getPropertyValue(object, propertyName);
+			propertyNodes.push(/* @__PURE__ */ React.createElement("span", { key: propertyName }, /* @__PURE__ */ React.createElement(ObjectName, { name: propertyName || `""` }), ":\xA0", /* @__PURE__ */ React.createElement(ObjectValue, { object: propertyValue }), ellipsis));
+			if (ellipsis) break;
+		}
+		const objectConstructorName = object.constructor ? object.constructor.name : "Object";
+		return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { style: styles.objectDescription }, objectConstructorName === "Object" ? "" : `${objectConstructorName} `), /* @__PURE__ */ React.createElement("span", { style: styles.preview }, "{", intersperse(propertyNodes, ", "), "}"));
+	}
 };
 var ObjectRootLabel = ({ name, data }) => {
-  if (typeof name === "string") {
-    return /* @__PURE__ */ React14.createElement("span", null, /* @__PURE__ */ React14.createElement(ObjectName, {
-      name
-    }), /* @__PURE__ */ React14.createElement("span", null, ": "), /* @__PURE__ */ React14.createElement(ObjectPreview, {
-      data
-    }));
-  } else {
-    return /* @__PURE__ */ React14.createElement(ObjectPreview, {
-      data
-    });
-  }
+	if (typeof name === "string") return /* @__PURE__ */ React.createElement("span", null, /* @__PURE__ */ React.createElement(ObjectName, { name }), /* @__PURE__ */ React.createElement("span", null, ": "), /* @__PURE__ */ React.createElement(ObjectPreview, { data }));
+	else return /* @__PURE__ */ React.createElement(ObjectPreview, { data });
 };
 var ObjectLabel = ({ name, data, isNonenumerable = false }) => {
-  const object = data;
-  return /* @__PURE__ */ React14.createElement("span", null, typeof name === "string" ? /* @__PURE__ */ React14.createElement(ObjectName, {
-    name,
-    dimmed: isNonenumerable
-  }) : /* @__PURE__ */ React14.createElement(ObjectPreview, {
-    data: name
-  }), /* @__PURE__ */ React14.createElement("span", null, ": "), /* @__PURE__ */ React14.createElement(ObjectValue, {
-    object
-  }));
+	const object = data;
+	return /* @__PURE__ */ React.createElement("span", null, typeof name === "string" ? /* @__PURE__ */ React.createElement(ObjectName, {
+		name,
+		dimmed: isNonenumerable
+	}) : /* @__PURE__ */ React.createElement(ObjectPreview, { data: name }), /* @__PURE__ */ React.createElement("span", null, ": "), /* @__PURE__ */ React.createElement(ObjectValue, { object }));
 };
 var createIterator = (showNonenumerable, sortObjectKeys) => {
-  const objectIterator = function* (data) {
-    const shouldIterate = typeof data === "object" && data !== null || typeof data === "function";
-    if (!shouldIterate)
-      return;
-    const dataIsArray = Array.isArray(data);
-    if (!dataIsArray && data[Symbol.iterator]) {
-      let i = 0;
-      for (const entry of data) {
-        if (Array.isArray(entry) && entry.length === 2) {
-          const [k, v] = entry;
-          yield {
-            name: k,
-            data: v
-          };
-        } else {
-          yield {
-            name: i.toString(),
-            data: entry
-          };
-        }
-        i++;
-      }
-    } else {
-      const keys = Object.getOwnPropertyNames(data);
-      if (sortObjectKeys === true && !dataIsArray) {
-        keys.sort();
-      } else if (typeof sortObjectKeys === "function") {
-        keys.sort(sortObjectKeys);
-      }
-      for (const propertyName of keys) {
-        if (propertyIsEnumerable.call(data, propertyName)) {
-          const propertyValue = getPropertyValue(data, propertyName);
-          yield {
-            name: propertyName || `""`,
-            data: propertyValue
-          };
-        } else if (showNonenumerable) {
-          let propertyValue;
-          try {
-            propertyValue = getPropertyValue(data, propertyName);
-          } catch (e) {
-          }
-          if (propertyValue !== void 0) {
-            yield {
-              name: propertyName,
-              data: propertyValue,
-              isNonenumerable: true
-            };
-          }
-        }
-      }
-      if (showNonenumerable && data !== Object.prototype) {
-        yield {
-          name: "__proto__",
-          data: Object.getPrototypeOf(data),
-          isNonenumerable: true
-        };
-      }
-    }
-  };
-  return objectIterator;
+	const objectIterator = function* (data) {
+		const shouldIterate = typeof data === "object" && data !== null || typeof data === "function";
+		if (!shouldIterate) return;
+		const dataIsArray = Array.isArray(data);
+		if (!dataIsArray && data[Symbol.iterator]) {
+			let i = 0;
+			for (const entry of data) {
+				if (Array.isArray(entry) && entry.length === 2) {
+					const [k, v] = entry;
+					yield {
+						name: k,
+						data: v
+					};
+				} else yield {
+					name: i.toString(),
+					data: entry
+				};
+				i++;
+			}
+		} else {
+			const keys = Object.getOwnPropertyNames(data);
+			if (sortObjectKeys === true && !dataIsArray) keys.sort();
+			else if (typeof sortObjectKeys === "function") keys.sort(sortObjectKeys);
+			for (const propertyName of keys) if (propertyIsEnumerable.call(data, propertyName)) {
+				const propertyValue = getPropertyValue(data, propertyName);
+				yield {
+					name: propertyName || `""`,
+					data: propertyValue
+				};
+			} else if (showNonenumerable) {
+				let propertyValue;
+				try {
+					propertyValue = getPropertyValue(data, propertyName);
+				} catch (e) {}
+				if (propertyValue !== void 0) yield {
+					name: propertyName,
+					data: propertyValue,
+					isNonenumerable: true
+				};
+			}
+			if (showNonenumerable && data !== Object.prototype) yield {
+				name: "__proto__",
+				data: Object.getPrototypeOf(data),
+				isNonenumerable: true
+			};
+		}
+	};
+	return objectIterator;
 };
-var defaultNodeRenderer = ({ depth, name, data, isNonenumerable }) => depth === 0 ? /* @__PURE__ */ React14.createElement(ObjectRootLabel, {
-  name,
-  data
-}) : /* @__PURE__ */ React14.createElement(ObjectLabel, {
-  name,
-  data,
-  isNonenumerable
+var defaultNodeRenderer = ({ depth, name, data, isNonenumerable }) => depth === 0 ? /* @__PURE__ */ React.createElement(ObjectRootLabel, {
+	name,
+	data
+}) : /* @__PURE__ */ React.createElement(ObjectLabel, {
+	name,
+	data,
+	isNonenumerable
 });
-var ObjectInspector = ({ showNonenumerable = false, sortObjectKeys, nodeRenderer, ...treeViewProps }) => {
-  const dataIterator = createIterator(showNonenumerable, sortObjectKeys);
-  const renderer = nodeRenderer ? nodeRenderer : defaultNodeRenderer;
-  return /* @__PURE__ */ React14.createElement(TreeView, {
-    nodeRenderer: renderer,
-    dataIterator,
-    ...treeViewProps
-  });
+var ObjectInspector = ({ showNonenumerable = false, sortObjectKeys, nodeRenderer,...treeViewProps }) => {
+	const dataIterator = createIterator(showNonenumerable, sortObjectKeys);
+	const renderer = nodeRenderer ? nodeRenderer : defaultNodeRenderer;
+	return /* @__PURE__ */ React.createElement(TreeView, {
+		nodeRenderer: renderer,
+		dataIterator,
+		...treeViewProps
+	});
 };
 var themedObjectInspector = themeAcceptor(ObjectInspector);
 function getHeaders(data) {
-  if (typeof data === "object") {
-    let rowHeaders = [];
-    if (Array.isArray(data)) {
-      const nRows = data.length;
-      rowHeaders = [...Array(nRows).keys()];
-    } else if (data !== null) {
-      rowHeaders = Object.keys(data);
-    }
-    const colHeaders = rowHeaders.reduce((colHeaders2, rowHeader) => {
-      const row = data[rowHeader];
-      if (typeof row === "object" && row !== null) {
-        const cols = Object.keys(row);
-        cols.reduce((xs, x) => {
-          if (!xs.includes(x)) {
-            xs.push(x);
-          }
-          return xs;
-        }, colHeaders2);
-      }
-      return colHeaders2;
-    }, []);
-    return {
-      rowHeaders,
-      colHeaders
-    };
-  }
-  return void 0;
+	if (typeof data === "object") {
+		let rowHeaders = [];
+		if (Array.isArray(data)) {
+			const nRows = data.length;
+			rowHeaders = [...Array(nRows).keys()];
+		} else if (data !== null) rowHeaders = Object.keys(data);
+		const colHeaders = rowHeaders.reduce((colHeaders2, rowHeader) => {
+			const row = data[rowHeader];
+			if (typeof row === "object" && row !== null) {
+				const cols = Object.keys(row);
+				cols.reduce((xs, x) => {
+					if (!xs.includes(x)) xs.push(x);
+					return xs;
+				}, colHeaders2);
+			}
+			return colHeaders2;
+		}, []);
+		return {
+			rowHeaders,
+			colHeaders
+		};
+	}
+	return void 0;
 }
 var DataContainer = ({ rows, columns, rowsData }) => {
-  const styles = useStyles("TableInspectorDataContainer");
-  const borderStyles = useStyles("TableInspectorLeftBorder");
-  return /* @__PURE__ */ React14.createElement("div", {
-    style: styles.div
-  }, /* @__PURE__ */ React14.createElement("table", {
-    style: styles.table
-  }, /* @__PURE__ */ React14.createElement("colgroup", null), /* @__PURE__ */ React14.createElement("tbody", null, rows.map((row, i) => /* @__PURE__ */ React14.createElement("tr", {
-    key: row,
-    style: styles.tr
-  }, /* @__PURE__ */ React14.createElement("td", {
-    style: { ...styles.td, ...borderStyles.none }
-  }, row), columns.map((column) => {
-    const rowData = rowsData[i];
-    if (typeof rowData === "object" && rowData !== null && hasOwnProperty.call(rowData, column)) {
-      return /* @__PURE__ */ React14.createElement("td", {
-        key: column,
-        style: { ...styles.td, ...borderStyles.solid }
-      }, /* @__PURE__ */ React14.createElement(ObjectValue, {
-        object: rowData[column]
-      }));
-    } else {
-      return /* @__PURE__ */ React14.createElement("td", {
-        key: column,
-        style: { ...styles.td, ...borderStyles.solid }
-      });
-    }
-  }))))));
+	const styles = useStyles("TableInspectorDataContainer");
+	const borderStyles = useStyles("TableInspectorLeftBorder");
+	return /* @__PURE__ */ React.createElement("div", { style: styles.div }, /* @__PURE__ */ React.createElement("table", { style: styles.table }, /* @__PURE__ */ React.createElement("colgroup", null), /* @__PURE__ */ React.createElement("tbody", null, rows.map((row, i) => /* @__PURE__ */ React.createElement("tr", {
+		key: row,
+		style: styles.tr
+	}, /* @__PURE__ */ React.createElement("td", { style: {
+		...styles.td,
+		...borderStyles.none
+	} }, row), columns.map((column) => {
+		const rowData = rowsData[i];
+		if (typeof rowData === "object" && rowData !== null && hasOwnProperty.call(rowData, column)) return /* @__PURE__ */ React.createElement("td", {
+			key: column,
+			style: {
+				...styles.td,
+				...borderStyles.solid
+			}
+		}, /* @__PURE__ */ React.createElement(ObjectValue, { object: rowData[column] }));
+		else return /* @__PURE__ */ React.createElement("td", {
+			key: column,
+			style: {
+				...styles.td,
+				...borderStyles.solid
+			}
+		});
+	}))))));
 };
-var SortIconContainer = (props) => /* @__PURE__ */ React14.createElement("div", {
-  style: {
-    position: "absolute",
-    top: 1,
-    right: 0,
-    bottom: 1,
-    display: "flex",
-    alignItems: "center"
-  }
-}, props.children);
+var SortIconContainer = (props) => /* @__PURE__ */ React.createElement("div", { style: {
+	position: "absolute",
+	top: 1,
+	right: 0,
+	bottom: 1,
+	display: "flex",
+	alignItems: "center"
+} }, props.children);
 var SortIcon = ({ sortAscending }) => {
-  const styles = useStyles("TableInspectorSortIcon");
-  const glyph = sortAscending ? "\u25B2" : "\u25BC";
-  return /* @__PURE__ */ React14.createElement("div", {
-    style: styles
-  }, glyph);
+	const styles = useStyles("TableInspectorSortIcon");
+	const glyph = sortAscending ? "▲" : "▼";
+	return /* @__PURE__ */ React.createElement("div", { style: styles }, glyph);
 };
-var TH = ({
-  sortAscending = false,
-  sorted = false,
-  onClick = void 0,
-  borderStyle = {},
-  children,
-  ...thProps
-}) => {
-  const styles = useStyles("TableInspectorTH");
-  const [hovered, setHovered] = useState(false);
-  const handleMouseEnter = useCallback(() => setHovered(true), []);
-  const handleMouseLeave = useCallback(() => setHovered(false), []);
-  return /* @__PURE__ */ React14.createElement("th", {
-    ...thProps,
-    style: {
-      ...styles.base,
-      ...borderStyle,
-      ...hovered ? styles.base[":hover"] : {}
-    },
-    onMouseEnter: handleMouseEnter,
-    onMouseLeave: handleMouseLeave,
-    onClick
-  }, /* @__PURE__ */ React14.createElement("div", {
-    style: styles.div
-  }, children), sorted && /* @__PURE__ */ React14.createElement(SortIconContainer, null, /* @__PURE__ */ React14.createElement(SortIcon, {
-    sortAscending
-  })));
+var TH = ({ sortAscending = false, sorted = false, onClick = void 0, borderStyle = {}, children,...thProps }) => {
+	const styles = useStyles("TableInspectorTH");
+	const [hovered, setHovered] = useState(false);
+	const handleMouseEnter = useCallback(() => setHovered(true), []);
+	const handleMouseLeave = useCallback(() => setHovered(false), []);
+	return /* @__PURE__ */ React.createElement("th", {
+		...thProps,
+		style: {
+			...styles.base,
+			...borderStyle,
+			...hovered ? styles.base[":hover"] : {}
+		},
+		onMouseEnter: handleMouseEnter,
+		onMouseLeave: handleMouseLeave,
+		onClick
+	}, /* @__PURE__ */ React.createElement("div", { style: styles.div }, children), sorted && /* @__PURE__ */ React.createElement(SortIconContainer, null, /* @__PURE__ */ React.createElement(SortIcon, { sortAscending })));
 };
-var HeaderContainer = ({
-  indexColumnText = "(index)",
-  columns = [],
-  sorted,
-  sortIndexColumn,
-  sortColumn,
-  sortAscending,
-  onTHClick,
-  onIndexTHClick
-}) => {
-  const styles = useStyles("TableInspectorHeaderContainer");
-  const borderStyles = useStyles("TableInspectorLeftBorder");
-  return /* @__PURE__ */ React14.createElement("div", {
-    style: styles.base
-  }, /* @__PURE__ */ React14.createElement("table", {
-    style: styles.table
-  }, /* @__PURE__ */ React14.createElement("tbody", null, /* @__PURE__ */ React14.createElement("tr", null, /* @__PURE__ */ React14.createElement(TH, {
-    borderStyle: borderStyles.none,
-    sorted: sorted && sortIndexColumn,
-    sortAscending,
-    onClick: onIndexTHClick
-  }, indexColumnText), columns.map((column) => /* @__PURE__ */ React14.createElement(TH, {
-    borderStyle: borderStyles.solid,
-    key: column,
-    sorted: sorted && sortColumn === column,
-    sortAscending,
-    onClick: onTHClick.bind(null, column)
-  }, column))))));
+var HeaderContainer = ({ indexColumnText = "(index)", columns = [], sorted, sortIndexColumn, sortColumn, sortAscending, onTHClick, onIndexTHClick }) => {
+	const styles = useStyles("TableInspectorHeaderContainer");
+	const borderStyles = useStyles("TableInspectorLeftBorder");
+	return /* @__PURE__ */ React.createElement("div", { style: styles.base }, /* @__PURE__ */ React.createElement("table", { style: styles.table }, /* @__PURE__ */ React.createElement("tbody", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement(TH, {
+		borderStyle: borderStyles.none,
+		sorted: sorted && sortIndexColumn,
+		sortAscending,
+		onClick: onIndexTHClick
+	}, indexColumnText), columns.map((column) => /* @__PURE__ */ React.createElement(TH, {
+		borderStyle: borderStyles.solid,
+		key: column,
+		sorted: sorted && sortColumn === column,
+		sortAscending,
+		onClick: onTHClick.bind(null, column)
+	}, column))))));
 };
-var TableInspector = ({
-  data,
-  columns
-}) => {
-  const styles = useStyles("TableInspector");
-  const [{ sorted, sortIndexColumn, sortColumn, sortAscending }, setState] = useState({
-    sorted: false,
-    sortIndexColumn: false,
-    sortColumn: void 0,
-    sortAscending: false
-  });
-  const handleIndexTHClick = useCallback(() => {
-    setState(({ sortIndexColumn: sortIndexColumn2, sortAscending: sortAscending2 }) => ({
-      sorted: true,
-      sortIndexColumn: true,
-      sortColumn: void 0,
-      sortAscending: sortIndexColumn2 ? !sortAscending2 : true
-    }));
-  }, []);
-  const handleTHClick = useCallback((col) => {
-    setState(({ sortColumn: sortColumn2, sortAscending: sortAscending2 }) => ({
-      sorted: true,
-      sortIndexColumn: false,
-      sortColumn: col,
-      sortAscending: col === sortColumn2 ? !sortAscending2 : true
-    }));
-  }, []);
-  if (typeof data !== "object" || data === null) {
-    return /* @__PURE__ */ React14.createElement("div", null);
-  }
-  let { rowHeaders, colHeaders } = getHeaders(data);
-  if (columns !== void 0) {
-    colHeaders = columns;
-  }
-  let rowsData = rowHeaders.map((rowHeader) => data[rowHeader]);
-  let columnDataWithRowIndexes;
-  if (sortColumn !== void 0) {
-    columnDataWithRowIndexes = rowsData.map((rowData, index) => {
-      if (typeof rowData === "object" && rowData !== null) {
-        const columnData = rowData[sortColumn];
-        return [columnData, index];
-      }
-      return [void 0, index];
-    });
-  } else {
-    if (sortIndexColumn) {
-      columnDataWithRowIndexes = rowHeaders.map((rowData, index) => {
-        const columnData = rowHeaders[index];
-        return [columnData, index];
-      });
-    }
-  }
-  if (columnDataWithRowIndexes !== void 0) {
-    const comparator = (mapper, ascending) => {
-      return (a, b) => {
-        const v1 = mapper(a);
-        const v2 = mapper(b);
-        const type1 = typeof v1;
-        const type2 = typeof v2;
-        const lt = (v12, v22) => {
-          if (v12 < v22) {
-            return -1;
-          } else if (v12 > v22) {
-            return 1;
-          } else {
-            return 0;
-          }
-        };
-        let result;
-        if (type1 === type2) {
-          result = lt(v1, v2);
-        } else {
-          const order = {
-            string: 0,
-            number: 1,
-            object: 2,
-            symbol: 3,
-            boolean: 4,
-            undefined: 5,
-            function: 6
-          };
-          result = lt(order[type1], order[type2]);
-        }
-        if (!ascending)
-          result = -result;
-        return result;
-      };
-    };
-    const sortedRowIndexes = columnDataWithRowIndexes.sort(comparator((item) => item[0], sortAscending)).map((item) => item[1]);
-    rowHeaders = sortedRowIndexes.map((i) => rowHeaders[i]);
-    rowsData = sortedRowIndexes.map((i) => rowsData[i]);
-  }
-  return /* @__PURE__ */ React14.createElement("div", {
-    style: styles.base
-  }, /* @__PURE__ */ React14.createElement(HeaderContainer, {
-    columns: colHeaders,
-    sorted,
-    sortIndexColumn,
-    sortColumn,
-    sortAscending,
-    onTHClick: handleTHClick,
-    onIndexTHClick: handleIndexTHClick
-  }), /* @__PURE__ */ React14.createElement(DataContainer, {
-    rows: rowHeaders,
-    columns: colHeaders,
-    rowsData
-  }));
+var TableInspector = ({ data, columns }) => {
+	const styles = useStyles("TableInspector");
+	const [{ sorted, sortIndexColumn, sortColumn, sortAscending }, setState] = useState({
+		sorted: false,
+		sortIndexColumn: false,
+		sortColumn: void 0,
+		sortAscending: false
+	});
+	const handleIndexTHClick = useCallback(() => {
+		setState(({ sortIndexColumn: sortIndexColumn2, sortAscending: sortAscending2 }) => ({
+			sorted: true,
+			sortIndexColumn: true,
+			sortColumn: void 0,
+			sortAscending: sortIndexColumn2 ? !sortAscending2 : true
+		}));
+	}, []);
+	const handleTHClick = useCallback((col) => {
+		setState(({ sortColumn: sortColumn2, sortAscending: sortAscending2 }) => ({
+			sorted: true,
+			sortIndexColumn: false,
+			sortColumn: col,
+			sortAscending: col === sortColumn2 ? !sortAscending2 : true
+		}));
+	}, []);
+	if (typeof data !== "object" || data === null) return /* @__PURE__ */ React.createElement("div", null);
+	let { rowHeaders, colHeaders } = getHeaders(data);
+	if (columns !== void 0) colHeaders = columns;
+	let rowsData = rowHeaders.map((rowHeader) => data[rowHeader]);
+	let columnDataWithRowIndexes;
+	if (sortColumn !== void 0) columnDataWithRowIndexes = rowsData.map((rowData, index) => {
+		if (typeof rowData === "object" && rowData !== null) {
+			const columnData = rowData[sortColumn];
+			return [columnData, index];
+		}
+		return [void 0, index];
+	});
+	else if (sortIndexColumn) columnDataWithRowIndexes = rowHeaders.map((rowData, index) => {
+		const columnData = rowHeaders[index];
+		return [columnData, index];
+	});
+	if (columnDataWithRowIndexes !== void 0) {
+		const comparator = (mapper, ascending) => {
+			return (a, b) => {
+				const v1 = mapper(a);
+				const v2 = mapper(b);
+				const type1 = typeof v1;
+				const type2 = typeof v2;
+				const lt = (v12, v22) => {
+					if (v12 < v22) return -1;
+					else if (v12 > v22) return 1;
+					else return 0;
+				};
+				let result;
+				if (type1 === type2) result = lt(v1, v2);
+				else {
+					const order = {
+						string: 0,
+						number: 1,
+						object: 2,
+						symbol: 3,
+						boolean: 4,
+						undefined: 5,
+						function: 6
+					};
+					result = lt(order[type1], order[type2]);
+				}
+				if (!ascending) result = -result;
+				return result;
+			};
+		};
+		const sortedRowIndexes = columnDataWithRowIndexes.sort(comparator((item) => item[0], sortAscending)).map((item) => item[1]);
+		rowHeaders = sortedRowIndexes.map((i) => rowHeaders[i]);
+		rowsData = sortedRowIndexes.map((i) => rowsData[i]);
+	}
+	return /* @__PURE__ */ React.createElement("div", { style: styles.base }, /* @__PURE__ */ React.createElement(HeaderContainer, {
+		columns: colHeaders,
+		sorted,
+		sortIndexColumn,
+		sortColumn,
+		sortAscending,
+		onTHClick: handleTHClick,
+		onIndexTHClick: handleIndexTHClick
+	}), /* @__PURE__ */ React.createElement(DataContainer, {
+		rows: rowHeaders,
+		columns: colHeaders,
+		rowsData
+	}));
 };
 var themedTableInspector = themeAcceptor(TableInspector);
 var TEXT_NODE_MAX_INLINE_CHARS = 80;
 var shouldInline = (data) => data.childNodes.length === 0 || data.childNodes.length === 1 && data.childNodes[0].nodeType === Node.TEXT_NODE && data.textContent.length < TEXT_NODE_MAX_INLINE_CHARS;
 var OpenTag = ({ tagName, attributes, styles }) => {
-  return /* @__PURE__ */ React14.createElement("span", {
-    style: styles.base
-  }, "<", /* @__PURE__ */ React14.createElement("span", {
-    style: styles.tagName
-  }, tagName), (() => {
-    if (attributes) {
-      const attributeNodes = [];
-      for (let i = 0; i < attributes.length; i++) {
-        const attribute = attributes[i];
-        attributeNodes.push(/* @__PURE__ */ React14.createElement("span", {
-          key: i
-        }, " ", /* @__PURE__ */ React14.createElement("span", {
-          style: styles.htmlAttributeName
-        }, attribute.name), '="', /* @__PURE__ */ React14.createElement("span", {
-          style: styles.htmlAttributeValue
-        }, attribute.value), '"'));
-      }
-      return attributeNodes;
-    }
-  })(), ">");
+	return /* @__PURE__ */ React.createElement("span", { style: styles.base }, "<", /* @__PURE__ */ React.createElement("span", { style: styles.tagName }, tagName), (() => {
+		if (attributes) {
+			const attributeNodes = [];
+			for (let i = 0; i < attributes.length; i++) {
+				const attribute = attributes[i];
+				attributeNodes.push(/* @__PURE__ */ React.createElement("span", { key: i }, " ", /* @__PURE__ */ React.createElement("span", { style: styles.htmlAttributeName }, attribute.name), "=\"", /* @__PURE__ */ React.createElement("span", { style: styles.htmlAttributeValue }, attribute.value), "\""));
+			}
+			return attributeNodes;
+		}
+	})(), ">");
 };
-var CloseTag = ({ tagName, isChildNode = false, styles }) => /* @__PURE__ */ React14.createElement("span", {
-  style: Object.assign({}, styles.base, isChildNode && styles.offsetLeft)
-}, "</", /* @__PURE__ */ React14.createElement("span", {
-  style: styles.tagName
-}, tagName), ">");
+var CloseTag = ({ tagName, isChildNode = false, styles }) => /* @__PURE__ */ React.createElement("span", { style: Object.assign({}, styles.base, isChildNode && styles.offsetLeft) }, "</", /* @__PURE__ */ React.createElement("span", { style: styles.tagName }, tagName), ">");
 var nameByNodeType = {
-  1: "ELEMENT_NODE",
-  3: "TEXT_NODE",
-  7: "PROCESSING_INSTRUCTION_NODE",
-  8: "COMMENT_NODE",
-  9: "DOCUMENT_NODE",
-  10: "DOCUMENT_TYPE_NODE",
-  11: "DOCUMENT_FRAGMENT_NODE"
+	1: "ELEMENT_NODE",
+	3: "TEXT_NODE",
+	7: "PROCESSING_INSTRUCTION_NODE",
+	8: "COMMENT_NODE",
+	9: "DOCUMENT_NODE",
+	10: "DOCUMENT_TYPE_NODE",
+	11: "DOCUMENT_FRAGMENT_NODE"
 };
 var DOMNodePreview = ({ isCloseTag, data, expanded }) => {
-  const styles = useStyles("DOMNodePreview");
-  if (isCloseTag) {
-    return /* @__PURE__ */ React14.createElement(CloseTag, {
-      styles: styles.htmlCloseTag,
-      isChildNode: true,
-      tagName: data.tagName
-    });
-  }
-  switch (data.nodeType) {
-    case Node.ELEMENT_NODE:
-      return /* @__PURE__ */ React14.createElement("span", null, /* @__PURE__ */ React14.createElement(OpenTag, {
-        tagName: data.tagName,
-        attributes: data.attributes,
-        styles: styles.htmlOpenTag
-      }), shouldInline(data) ? data.textContent : !expanded && "\u2026", !expanded && /* @__PURE__ */ React14.createElement(CloseTag, {
-        tagName: data.tagName,
-        styles: styles.htmlCloseTag
-      }));
-    case Node.TEXT_NODE:
-      return /* @__PURE__ */ React14.createElement("span", null, data.textContent);
-    case Node.CDATA_SECTION_NODE:
-      return /* @__PURE__ */ React14.createElement("span", null, "<![CDATA[" + data.textContent + "]]>");
-    case Node.COMMENT_NODE:
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: styles.htmlComment
-      }, "<!--", data.textContent, "-->");
-    case Node.PROCESSING_INSTRUCTION_NODE:
-      return /* @__PURE__ */ React14.createElement("span", null, data.nodeName);
-    case Node.DOCUMENT_TYPE_NODE:
-      return /* @__PURE__ */ React14.createElement("span", {
-        style: styles.htmlDoctype
-      }, "<!DOCTYPE ", data.name, data.publicId ? ` PUBLIC "${data.publicId}"` : "", !data.publicId && data.systemId ? " SYSTEM" : "", data.systemId ? ` "${data.systemId}"` : "", ">");
-    case Node.DOCUMENT_NODE:
-      return /* @__PURE__ */ React14.createElement("span", null, data.nodeName);
-    case Node.DOCUMENT_FRAGMENT_NODE:
-      return /* @__PURE__ */ React14.createElement("span", null, data.nodeName);
-    default:
-      return /* @__PURE__ */ React14.createElement("span", null, nameByNodeType[data.nodeType]);
-  }
+	const styles = useStyles("DOMNodePreview");
+	if (isCloseTag) return /* @__PURE__ */ React.createElement(CloseTag, {
+		styles: styles.htmlCloseTag,
+		isChildNode: true,
+		tagName: data.tagName
+	});
+	switch (data.nodeType) {
+		case Node.ELEMENT_NODE: return /* @__PURE__ */ React.createElement("span", null, /* @__PURE__ */ React.createElement(OpenTag, {
+			tagName: data.tagName,
+			attributes: data.attributes,
+			styles: styles.htmlOpenTag
+		}), shouldInline(data) ? data.textContent : !expanded && "…", !expanded && /* @__PURE__ */ React.createElement(CloseTag, {
+			tagName: data.tagName,
+			styles: styles.htmlCloseTag
+		}));
+		case Node.TEXT_NODE: return /* @__PURE__ */ React.createElement("span", null, data.textContent);
+		case Node.CDATA_SECTION_NODE: return /* @__PURE__ */ React.createElement("span", null, "<![CDATA[" + data.textContent + "]]>");
+		case Node.COMMENT_NODE: return /* @__PURE__ */ React.createElement("span", { style: styles.htmlComment }, "<!--", data.textContent, "-->");
+		case Node.PROCESSING_INSTRUCTION_NODE: return /* @__PURE__ */ React.createElement("span", null, data.nodeName);
+		case Node.DOCUMENT_TYPE_NODE: return /* @__PURE__ */ React.createElement("span", { style: styles.htmlDoctype }, "<!DOCTYPE ", data.name, data.publicId ? ` PUBLIC "${data.publicId}"` : "", !data.publicId && data.systemId ? " SYSTEM" : "", data.systemId ? ` "${data.systemId}"` : "", ">");
+		case Node.DOCUMENT_NODE: return /* @__PURE__ */ React.createElement("span", null, data.nodeName);
+		case Node.DOCUMENT_FRAGMENT_NODE: return /* @__PURE__ */ React.createElement("span", null, data.nodeName);
+		default: return /* @__PURE__ */ React.createElement("span", null, nameByNodeType[data.nodeType]);
+	}
 };
 var domIterator = function* (data) {
-  if (data && data.childNodes) {
-    const textInlined = shouldInline(data);
-    if (textInlined) {
-      return;
-    }
-    for (let i = 0; i < data.childNodes.length; i++) {
-      const node = data.childNodes[i];
-      if (node.nodeType === Node.TEXT_NODE && node.textContent.trim().length === 0)
-        continue;
-      yield {
-        name: `${node.tagName}[${i}]`,
-        data: node
-      };
-    }
-    if (data.tagName) {
-      yield {
-        name: "CLOSE_TAG",
-        data: {
-          tagName: data.tagName
-        },
-        isCloseTag: true
-      };
-    }
-  }
+	if (data && data.childNodes) {
+		const textInlined = shouldInline(data);
+		if (textInlined) return;
+		for (let i = 0; i < data.childNodes.length; i++) {
+			const node = data.childNodes[i];
+			if (node.nodeType === Node.TEXT_NODE && node.textContent.trim().length === 0) continue;
+			yield {
+				name: `${node.tagName}[${i}]`,
+				data: node
+			};
+		}
+		if (data.tagName) yield {
+			name: "CLOSE_TAG",
+			data: { tagName: data.tagName },
+			isCloseTag: true
+		};
+	}
 };
 var DOMInspector = (props) => {
-  return /* @__PURE__ */ React14.createElement(TreeView, {
-    nodeRenderer: DOMNodePreview,
-    dataIterator: domIterator,
-    ...props
-  });
+	return /* @__PURE__ */ React.createElement(TreeView, {
+		nodeRenderer: DOMNodePreview,
+		dataIterator: domIterator,
+		...props
+	});
 };
 var themedDOMInspector = themeAcceptor(DOMInspector);
 var import_is_dom = __toESM(require_is_dom());
-var Inspector = ({ table = false, data, ...rest }) => {
-  if (table) {
-    return /* @__PURE__ */ React14.createElement(themedTableInspector, {
-      data,
-      ...rest
-    });
-  }
-  if ((0, import_is_dom.default)(data))
-    return /* @__PURE__ */ React14.createElement(themedDOMInspector, {
-      data,
-      ...rest
-    });
-  return /* @__PURE__ */ React14.createElement(themedObjectInspector, {
-    data,
-    ...rest
-  });
+var Inspector$1 = ({ table = false, data,...rest }) => {
+	if (table) return /* @__PURE__ */ React.createElement(themedTableInspector, {
+		data,
+		...rest
+	});
+	if ((0, import_is_dom.default)(data)) return /* @__PURE__ */ React.createElement(themedDOMInspector, {
+		data,
+		...rest
+	});
+	return /* @__PURE__ */ React.createElement(themedObjectInspector, {
+		data,
+		...rest
+	});
 };
 
-// src/experiments/inspect.tsx
-var useImperativeHandlePolyfill = (ref, init, deps) => {
-  useEffect(() => {
-    if (ref) {
-      if (typeof ref === "function") {
-        ref(init());
-      } else if (typeof ref === "object" && "current" in ref) {
-        ref.current = init();
-      }
-    }
-  }, deps);
+//#endregion
+//#region src/experiments/inspect.tsx
+const useImperativeHandlePolyfill = (ref, init, deps) => {
+	useEffect(() => {
+		if (ref) {
+			if (typeof ref === "function") ref(init());
+			else if (typeof ref === "object" && "current" in ref) ref.current = init();
+		}
+	}, deps);
 };
-var useImperativeHandle = useImperativeHandle$1 || useImperativeHandlePolyfill;
-var throttle = (fn, wait) => {
-  let timeout = null;
-  return function() {
-    if (!timeout) {
-      timeout = setTimeout(() => {
-        fn.apply(this, arguments);
-        timeout = null;
-      }, wait);
-    }
-  };
+const useImperativeHandle$1 = useImperativeHandle || useImperativeHandlePolyfill;
+const throttle = (fn, wait) => {
+	let timeout = null;
+	return function() {
+		if (!timeout) timeout = setTimeout(() => {
+			fn.apply(this, arguments);
+			timeout = null;
+		}, wait);
+	};
 };
-var theme3 = {
-  BASE_FONT_FAMILY: "Menlo, monospace",
-  BASE_FONT_SIZE: "12px",
-  BASE_LINE_HEIGHT: 1.2,
-  BASE_BACKGROUND_COLOR: "none",
-  BASE_COLOR: "#FFF",
-  OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
-  OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
-  OBJECT_NAME_COLOR: "#FFC799",
-  OBJECT_VALUE_NULL_COLOR: "#A0A0A0",
-  OBJECT_VALUE_UNDEFINED_COLOR: "#A0A0A0",
-  OBJECT_VALUE_REGEXP_COLOR: "#FF8080",
-  OBJECT_VALUE_STRING_COLOR: "#99FFE4",
-  OBJECT_VALUE_SYMBOL_COLOR: "#FFC799",
-  OBJECT_VALUE_NUMBER_COLOR: "#FFC799",
-  OBJECT_VALUE_BOOLEAN_COLOR: "#FFC799",
-  OBJECT_VALUE_FUNCTION_PREFIX_COLOR: "#FFC799",
-  HTML_TAG_COLOR: "#FFC799",
-  HTML_TAGNAME_COLOR: "#FFC799",
-  HTML_TAGNAME_TEXT_TRANSFORM: "lowercase",
-  HTML_ATTRIBUTE_NAME_COLOR: "#A0A0A0",
-  HTML_ATTRIBUTE_VALUE_COLOR: "#99FFE4",
-  HTML_COMMENT_COLOR: "#8b8b8b94",
-  HTML_DOCTYPE_COLOR: "#A0A0A0",
-  ARROW_COLOR: "#A0A0A0",
-  ARROW_MARGIN_RIGHT: 3,
-  ARROW_FONT_SIZE: 12,
-  ARROW_ANIMATION_DURATION: "0",
-  TREENODE_FONT_FAMILY: "Menlo, monospace",
-  TREENODE_FONT_SIZE: "11px",
-  TREENODE_LINE_HEIGHT: 1.2,
-  TREENODE_PADDING_LEFT: 12,
-  TABLE_BORDER_COLOR: "#282828",
-  TABLE_TH_BACKGROUND_COLOR: "#161616",
-  TABLE_TH_HOVER_COLOR: "#232323",
-  TABLE_SORT_ICON_COLOR: "#A0A0A0",
-  TABLE_DATA_BACKGROUND_IMAGE: "none",
-  TABLE_DATA_BACKGROUND_SIZE: "0"
+const theme = {
+	BASE_FONT_FAMILY: "Menlo, monospace",
+	BASE_FONT_SIZE: "12px",
+	BASE_LINE_HEIGHT: 1.2,
+	BASE_BACKGROUND_COLOR: "none",
+	BASE_COLOR: "#FFF",
+	OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
+	OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
+	OBJECT_NAME_COLOR: "#FFC799",
+	OBJECT_VALUE_NULL_COLOR: "#A0A0A0",
+	OBJECT_VALUE_UNDEFINED_COLOR: "#A0A0A0",
+	OBJECT_VALUE_REGEXP_COLOR: "#FF8080",
+	OBJECT_VALUE_STRING_COLOR: "#99FFE4",
+	OBJECT_VALUE_SYMBOL_COLOR: "#FFC799",
+	OBJECT_VALUE_NUMBER_COLOR: "#FFC799",
+	OBJECT_VALUE_BOOLEAN_COLOR: "#FFC799",
+	OBJECT_VALUE_FUNCTION_PREFIX_COLOR: "#FFC799",
+	HTML_TAG_COLOR: "#FFC799",
+	HTML_TAGNAME_COLOR: "#FFC799",
+	HTML_TAGNAME_TEXT_TRANSFORM: "lowercase",
+	HTML_ATTRIBUTE_NAME_COLOR: "#A0A0A0",
+	HTML_ATTRIBUTE_VALUE_COLOR: "#99FFE4",
+	HTML_COMMENT_COLOR: "#8b8b8b94",
+	HTML_DOCTYPE_COLOR: "#A0A0A0",
+	ARROW_COLOR: "#A0A0A0",
+	ARROW_MARGIN_RIGHT: 3,
+	ARROW_FONT_SIZE: 12,
+	ARROW_ANIMATION_DURATION: "0",
+	TREENODE_FONT_FAMILY: "Menlo, monospace",
+	TREENODE_FONT_SIZE: "11px",
+	TREENODE_LINE_HEIGHT: 1.2,
+	TREENODE_PADDING_LEFT: 12,
+	TABLE_BORDER_COLOR: "#282828",
+	TABLE_TH_BACKGROUND_COLOR: "#161616",
+	TABLE_TH_HOVER_COLOR: "#232323",
+	TABLE_SORT_ICON_COLOR: "#A0A0A0",
+	TABLE_DATA_BACKGROUND_IMAGE: "none",
+	TABLE_DATA_BACKGROUND_SIZE: "0"
 };
-var RawInspector = forwardRef(
-  ({ enabled = true, dangerouslyRunInProduction = false }, ref) => {
-    const [element, setElement] = useState(null);
-    const [currentFiber, setCurrentFiber] = useState(null);
-    const [currentFiberSource, setCurrentFiberSource] = useState(null);
-    const [rect, setRect] = useState(null);
-    const [isActive, setIsActive] = useState(true);
-    const [isEnabled, setIsEnabled] = useState(enabled);
-    const [position, setPosition] = useState({ top: 0, left: 0 });
-    const currentCleanedFiber = useMemo(() => {
-      if (!currentFiber) return null;
-      const clonedFiber = { ...currentFiber };
-      for (const key in clonedFiber) {
-        const value = clonedFiber[key];
-        if (!value) delete clonedFiber[key];
-      }
-      return clonedFiber;
-    }, [currentFiber]);
-    useImperativeHandle(ref, () => ({
-      enable: () => setIsEnabled(true),
-      disable: () => {
-        setIsEnabled(false);
-        setElement(null);
-        setRect(null);
-      },
-      inspectElement: (element2) => {
-        if (!isEnabled) return;
-        setElement(element2);
-        setRect(element2.getBoundingClientRect());
-      }
-    }));
-    useEffect(() => {
-      (async () => {
-        if (!element) return;
-        const fiber = getFiberFromHostInstance(element);
-        if (!fiber) return;
-        const latestFiber = getLatestFiber(fiber);
-        const source = await getFiberSource(latestFiber);
-        setCurrentFiber(latestFiber);
-        if (source) {
-          setCurrentFiberSource(source);
-        }
-      })();
-    }, [element]);
-    useEffect(() => {
-      const handleMouseMove = (event) => {
-        const isActive2 = isInstrumentationActive() || hasRDTHook();
-        if (!isActive2) {
-          setIsActive(false);
-          return;
-        }
-        if (!dangerouslyRunInProduction) {
-          const rdtHook = getRDTHook();
-          for (const renderer of rdtHook.renderers.values()) {
-            const buildType = detectReactBuildType(renderer);
-            if (buildType === "production") {
-              setIsActive(false);
-              return;
-            }
-          }
-        }
-        if (!isEnabled) {
-          setElement(null);
-          setRect(null);
-          return;
-        }
-        const element2 = document.elementFromPoint(event.clientX, event.clientY);
-        if (!element2) return;
-        setElement(element2);
-        setRect(element2.getBoundingClientRect());
-      };
-      const throttledMouseMove = throttle(handleMouseMove, 16);
-      document.addEventListener("mousemove", throttledMouseMove);
-      return () => document.removeEventListener("mousemove", throttledMouseMove);
-    }, [isEnabled, dangerouslyRunInProduction]);
-    useEffect(() => {
-      if (!rect) return;
-      const padding = 10;
-      const inspectorWidth = 400;
-      const inspectorHeight = 320;
-      let left = rect.left + rect.width + padding;
-      let top = rect.top;
-      if (left + inspectorWidth > window.innerWidth) {
-        left = Math.max(padding, rect.left - inspectorWidth - padding);
-      }
-      if (top >= rect.top && top <= rect.bottom) {
-        if (rect.bottom + inspectorHeight + padding <= window.innerHeight) {
-          top = rect.bottom + padding;
-        } else if (rect.top - inspectorHeight - padding >= 0) {
-          top = rect.top - inspectorHeight - padding;
-        } else {
-          top = window.innerHeight - inspectorHeight - padding;
-        }
-      }
-      top = Math.max(
-        padding,
-        Math.min(top, window.innerHeight - inspectorHeight - padding)
-      );
-      left = Math.max(
-        padding,
-        Math.min(left, window.innerWidth - inspectorWidth - padding)
-      );
-      setPosition({ top, left });
-    }, [rect]);
-    if (!rect || !isActive || !isEnabled) return null;
-    if (!currentFiber) return null;
-    return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(
-      "div",
-      {
-        className: "inspector-container",
-        style: {
-          position: "fixed",
-          backgroundColor: "#101010",
-          color: "#FFF",
-          zIndex: 50,
-          padding: "1rem",
-          width: "30ch",
-          height: "25ch",
-          transition: "all 150ms ease-in-out",
-          overflow: "auto",
-          boxShadow: "0 4px 8px rgba(0, 0, 0, 0.5)",
-          border: "1px solid #444",
-          borderRadius: "8px",
-          opacity: rect ? 1 : 0,
-          transform: rect ? "translateY(0)" : "translateY(10px)",
-          pointerEvents: rect ? "auto" : "none",
-          top: position.top,
-          left: position.left
-        }
-      },
-      currentFiber && /* @__PURE__ */ React14.createElement(
-        Inspector,
-        {
-          theme: theme3,
-          data: currentCleanedFiber,
-          expandLevel: 1,
-          table: false
-        }
-      ),
-      /* @__PURE__ */ React14.createElement(
-        "div",
-        {
-          style: {
-            position: "absolute",
-            bottom: "0",
-            left: "0",
-            right: "0",
-            display: "flex",
-            alignItems: "center",
-            gap: "1rem",
-            backgroundColor: "#101010",
-            padding: "0.75rem 1rem",
-            borderTop: "1px solid #555",
-            borderBottomLeftRadius: "8px",
-            borderBottomRightRadius: "8px",
-            zIndex: 1e3
-          }
-        },
-        /* @__PURE__ */ React14.createElement(
-          "div",
-          {
-            style: {
-              fontSize: "0.875rem",
-              color: "#FFF",
-              padding: "0.25rem 0.5rem",
-              borderRadius: "4px",
-              backgroundColor: "#3a3a3a"
-            }
-          },
-          `<${getDisplayName(currentFiber.type) || "unknown"}>`
-        ),
-        /* @__PURE__ */ React14.createElement(
-          "div",
-          {
-            style: {
-              fontSize: "0.75rem",
-              color: "#CCC"
-            }
-          },
-          currentFiberSource ? /* @__PURE__ */ React14.createElement(React14.Fragment, null, currentFiberSource.fileName.split("/").slice(-2).join("/"), " ", /* @__PURE__ */ React14.createElement("br", null), "@ line ", currentFiberSource.lineNumber, ", column", " ", currentFiberSource.columnNumber) : null
-        )
-      )
-    ), /* @__PURE__ */ React14.createElement("style", null, `
+const RawInspector = forwardRef(({ enabled = true, dangerouslyRunInProduction = false }, ref) => {
+	const [element, setElement] = useState(null);
+	const [currentFiber, setCurrentFiber] = useState(null);
+	const [currentFiberSource, setCurrentFiberSource] = useState(null);
+	const [rect, setRect] = useState(null);
+	const [isActive, setIsActive] = useState(true);
+	const [isEnabled, setIsEnabled] = useState(enabled);
+	const [position, setPosition] = useState({
+		top: 0,
+		left: 0
+	});
+	const currentCleanedFiber = useMemo(() => {
+		if (!currentFiber) return null;
+		const clonedFiber = { ...currentFiber };
+		for (const key in clonedFiber) {
+			const value = clonedFiber[key];
+			if (!value) delete clonedFiber[key];
+		}
+		return clonedFiber;
+	}, [currentFiber]);
+	useImperativeHandle$1(ref, () => ({
+		enable: () => setIsEnabled(true),
+		disable: () => {
+			setIsEnabled(false);
+			setElement(null);
+			setRect(null);
+		},
+		inspectElement: (element$1) => {
+			if (!isEnabled) return;
+			setElement(element$1);
+			setRect(element$1.getBoundingClientRect());
+		}
+	}));
+	useEffect(() => {
+		(async () => {
+			if (!element) return;
+			const fiber = getFiberFromHostInstance(element);
+			if (!fiber) return;
+			const latestFiber = getLatestFiber(fiber);
+			const source = await getFiberSource(latestFiber);
+			setCurrentFiber(latestFiber);
+			if (source) setCurrentFiberSource(source);
+		})();
+	}, [element]);
+	useEffect(() => {
+		const handleMouseMove = (event) => {
+			const isActive$1 = isInstrumentationActive() || hasRDTHook();
+			if (!isActive$1) {
+				setIsActive(false);
+				return;
+			}
+			if (!dangerouslyRunInProduction) {
+				const rdtHook = getRDTHook();
+				for (const renderer of rdtHook.renderers.values()) {
+					const buildType = detectReactBuildType(renderer);
+					if (buildType === "production") {
+						setIsActive(false);
+						return;
+					}
+				}
+			}
+			if (!isEnabled) {
+				setElement(null);
+				setRect(null);
+				return;
+			}
+			const element$1 = document.elementFromPoint(event.clientX, event.clientY);
+			if (!element$1) return;
+			setElement(element$1);
+			setRect(element$1.getBoundingClientRect());
+		};
+		const throttledMouseMove = throttle(handleMouseMove, 16);
+		document.addEventListener("mousemove", throttledMouseMove);
+		return () => document.removeEventListener("mousemove", throttledMouseMove);
+	}, [isEnabled, dangerouslyRunInProduction]);
+	useEffect(() => {
+		if (!rect) return;
+		const padding = 10;
+		const inspectorWidth = 400;
+		const inspectorHeight = 320;
+		let left = rect.left + rect.width + padding;
+		let top = rect.top;
+		if (left + inspectorWidth > window.innerWidth) left = Math.max(padding, rect.left - inspectorWidth - padding);
+		if (top >= rect.top && top <= rect.bottom) if (rect.bottom + inspectorHeight + padding <= window.innerHeight) top = rect.bottom + padding;
+		else if (rect.top - inspectorHeight - padding >= 0) top = rect.top - inspectorHeight - padding;
+		else top = window.innerHeight - inspectorHeight - padding;
+		top = Math.max(padding, Math.min(top, window.innerHeight - inspectorHeight - padding));
+		left = Math.max(padding, Math.min(left, window.innerWidth - inspectorWidth - padding));
+		setPosition({
+			top,
+			left
+		});
+	}, [rect]);
+	if (!rect || !isActive || !isEnabled) return null;
+	if (!currentFiber) return null;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsxs("div", {
+			className: "inspector-container",
+			style: {
+				position: "fixed",
+				backgroundColor: "#101010",
+				color: "#FFF",
+				zIndex: 50,
+				padding: "1rem",
+				width: "30ch",
+				height: "25ch",
+				transition: "all 150ms ease-in-out",
+				overflow: "auto",
+				boxShadow: "0 4px 8px rgba(0, 0, 0, 0.5)",
+				border: "1px solid #444",
+				borderRadius: "8px",
+				opacity: rect ? 1 : 0,
+				transform: rect ? "translateY(0)" : "translateY(10px)",
+				pointerEvents: rect ? "auto" : "none",
+				top: position.top,
+				left: position.left
+			},
+			children: [currentFiber && /* @__PURE__ */ jsx(Inspector$1, {
+				theme,
+				data: currentCleanedFiber,
+				expandLevel: 1,
+				table: false
+			}), /* @__PURE__ */ jsxs("div", {
+				style: {
+					position: "absolute",
+					bottom: "0",
+					left: "0",
+					right: "0",
+					display: "flex",
+					alignItems: "center",
+					gap: "1rem",
+					backgroundColor: "#101010",
+					padding: "0.75rem 1rem",
+					borderTop: "1px solid #555",
+					borderBottomLeftRadius: "8px",
+					borderBottomRightRadius: "8px",
+					zIndex: 1e3
+				},
+				children: [/* @__PURE__ */ jsx("div", {
+					style: {
+						fontSize: "0.875rem",
+						color: "#FFF",
+						padding: "0.25rem 0.5rem",
+						borderRadius: "4px",
+						backgroundColor: "#3a3a3a"
+					},
+					children: `<${getDisplayName(currentFiber.type) || "unknown"}>`
+				}), /* @__PURE__ */ jsx("div", {
+					style: {
+						fontSize: "0.75rem",
+						color: "#CCC"
+					},
+					children: currentFiberSource ? /* @__PURE__ */ jsxs(Fragment, { children: [
+						currentFiberSource.fileName.split("/").slice(-2).join("/"),
+						" ",
+						/* @__PURE__ */ jsx("br", {}),
+						"@ line ",
+						currentFiberSource.lineNumber,
+						", column",
+						" ",
+						currentFiberSource.columnNumber
+					] }) : null
+				})]
+			})]
+		}),
+		/* @__PURE__ */ jsx("style", { children: `
           .inspector-container::-webkit-scrollbar {
             width: 8px;
           }
@@ -1458,41 +1176,39 @@ var RawInspector = forwardRef(
           .inspector-container::-webkit-scrollbar-thumb:hover {
             background: #555;
           }
-        `), /* @__PURE__ */ React14.createElement(
-      "div",
-      {
-        style: {
-          position: "fixed",
-          zIndex: 40,
-          pointerEvents: "none",
-          transition: "all 150ms",
-          border: "1px dashed #505050",
-          left: rect.left,
-          top: rect.top,
-          width: rect.width,
-          height: rect.height,
-          opacity: rect ? 1 : 0
-        }
-      }
-    ));
-  }
-);
-var Inspector2 = forwardRef(
-  (props, ref) => {
-    const [root, setRoot] = useState(null);
-    useEffect(() => {
-      const div = document.createElement("div");
-      document.documentElement.appendChild(div);
-      const shadowRoot = div.attachShadow({ mode: "open" });
-      setRoot(shadowRoot);
-      return () => {
-        document.documentElement.removeChild(div);
-      };
-    }, []);
-    if (!root) return null;
-    return ReactDOM.createPortal(/* @__PURE__ */ React14.createElement(RawInspector, { ref, ...props }), root);
-  }
-);
-var inspect_default = Inspector2;
+        ` }),
+		/* @__PURE__ */ jsx("div", { style: {
+			position: "fixed",
+			zIndex: 40,
+			pointerEvents: "none",
+			transition: "all 150ms",
+			border: "1px dashed #505050",
+			left: rect.left,
+			top: rect.top,
+			width: rect.width,
+			height: rect.height,
+			opacity: rect ? 1 : 0
+		} })
+	] });
+});
+const Inspector = forwardRef((props, ref) => {
+	const [root, setRoot] = useState(null);
+	useEffect(() => {
+		const div = document.createElement("div");
+		document.documentElement.appendChild(div);
+		const shadowRoot = div.attachShadow({ mode: "open" });
+		setRoot(shadowRoot);
+		return () => {
+			document.documentElement.removeChild(div);
+		};
+	}, []);
+	if (!root) return null;
+	return ReactDOM.createPortal(/* @__PURE__ */ jsx(RawInspector, {
+		ref,
+		...props
+	}), root);
+});
+var inspect_default = Inspector;
 
-export { Inspector2 as Inspector, RawInspector, inspect_default as default };
+//#endregion
+export { Inspector, RawInspector, inspect_default as default };