@crimsonsunset/jsg-logger 1.5.2 → 1.5.4

package/devtools/dist/panel-entry.js

@@ -0,0 +1,4588 @@
+import { options, Component, createElement, Fragment, toChildArray, render, createRef, createContext, cloneElement, hydrate } from "preact";
+import * as hooks from "preact/hooks";
+import { useState, useRef, useReducer, useMemo, useLayoutEffect, useImperativeHandle, useId, useEffect, useDebugValue, useContext, useCallback } from "preact/hooks";
+import { Pane, Text, Heading, Button, Switch, defaultTheme, ThemeProvider } from "evergreen-ui";
+function _mergeNamespaces(n, m) {
+  for (var i = 0; i < m.length; i++) {
+    const e2 = m[i];
+    if (typeof e2 !== "string" && !Array.isArray(e2)) {
+      for (const k2 in e2) {
+        if (k2 !== "default" && !(k2 in n)) {
+          const d = Object.getOwnPropertyDescriptor(e2, k2);
+          if (d) {
+            Object.defineProperty(n, k2, d.get ? d : {
+              enumerable: true,
+              get: () => e2[k2]
+            });
+          }
+        }
+      }
+    }
+  }
+  return Object.freeze(Object.defineProperty(n, Symbol.toStringTag, { value: "Module" }));
+}
+var f = 0;
+function u(e2, t, n, o, i, u2) {
+  t || (t = {});
+  var a, c, p = t;
+  if ("ref" in p) for (c in p = {}, t) "ref" == c ? a = t[c] : p[c] = t[c];
+  var l = { type: e2, props: p, key: n, ref: a, __k: null, __: null, __b: 0, __e: null, __c: null, constructor: void 0, __v: --f, __i: -1, __u: 0, __source: i, __self: u2 };
+  if ("function" == typeof e2 && (a = e2.defaultProps)) for (c in a) void 0 === p[c] && (p[c] = a[c]);
+  return options.vnode && options.vnode(l), l;
+}
+function g(n, t) {
+  for (var e2 in t) n[e2] = t[e2];
+  return n;
+}
+function E(n, t) {
+  for (var e2 in n) if ("__source" !== e2 && !(e2 in t)) return true;
+  for (var r2 in t) if ("__source" !== r2 && n[r2] !== t[r2]) return true;
+  return false;
+}
+function C(n, t) {
+  var e2 = t(), r2 = useState({ t: { __: e2, u: t } }), u2 = r2[0].t, o = r2[1];
+  return useLayoutEffect(function() {
+    u2.__ = e2, u2.u = t, x(u2) && o({ t: u2 });
+  }, [n, e2, t]), useEffect(function() {
+    return x(u2) && o({ t: u2 }), n(function() {
+      x(u2) && o({ t: u2 });
+    });
+  }, [n]), e2;
+}
+function x(n) {
+  var t, e2, r2 = n.u, u2 = n.__;
+  try {
+    var o = r2();
+    return !((t = u2) === (e2 = o) && (0 !== t || 1 / t == 1 / e2) || t != t && e2 != e2);
+  } catch (n2) {
+    return true;
+  }
+}
+function R(n) {
+  n();
+}
+function w(n) {
+  return n;
+}
+function k() {
+  return [false, R];
+}
+var I = useLayoutEffect;
+function N(n, t) {
+  this.props = n, this.context = t;
+}
+function M(n, e2) {
+  function r2(n2) {
+    var t = this.props.ref, r3 = t == n2.ref;
+    return !r3 && t && (t.call ? t(null) : t.current = null), e2 ? !e2(this.props, n2) || !r3 : E(this.props, n2);
+  }
+  function u2(e3) {
+    return this.shouldComponentUpdate = r2, createElement(n, e3);
+  }
+  return u2.displayName = "Memo(" + (n.displayName || n.name) + ")", u2.prototype.isReactComponent = true, u2.__f = true, u2.type = n, u2;
+}
+(N.prototype = new Component()).isPureReactComponent = true, N.prototype.shouldComponentUpdate = function(n, t) {
+  return E(this.props, n) || E(this.state, t);
+};
+var T = options.__b;
+options.__b = function(n) {
+  n.type && n.type.__f && n.ref && (n.props.ref = n.ref, n.ref = null), T && T(n);
+};
+var A = "undefined" != typeof Symbol && Symbol.for && Symbol.for("react.forward_ref") || 3911;
+function D(n) {
+  function t(t2) {
+    var e2 = g({}, t2);
+    return delete e2.ref, n(e2, t2.ref || null);
+  }
+  return t.$$typeof = A, t.render = n, t.prototype.isReactComponent = t.__f = true, t.displayName = "ForwardRef(" + (n.displayName || n.name) + ")", t;
+}
+var L = function(n, t) {
+  return null == n ? null : toChildArray(toChildArray(n).map(t));
+}, O = { map: L, forEach: L, count: function(n) {
+  return n ? toChildArray(n).length : 0;
+}, only: function(n) {
+  var t = toChildArray(n);
+  if (1 !== t.length) throw "Children.only";
+  return t[0];
+}, toArray: toChildArray }, F = options.__e;
+options.__e = function(n, t, e2, r2) {
+  if (n.then) {
+    for (var u2, o = t; o = o.__; ) if ((u2 = o.__c) && u2.__c) return null == t.__e && (t.__e = e2.__e, t.__k = e2.__k), u2.__c(n, t);
+  }
+  F(n, t, e2, r2);
+};
+var U = options.unmount;
+function V(n, t, e2) {
+  return n && (n.__c && n.__c.__H && (n.__c.__H.__.forEach(function(n2) {
+    "function" == typeof n2.__c && n2.__c();
+  }), n.__c.__H = null), null != (n = g({}, n)).__c && (n.__c.__P === e2 && (n.__c.__P = t), n.__c.__e = true, n.__c = null), n.__k = n.__k && n.__k.map(function(n2) {
+    return V(n2, t, e2);
+  })), n;
+}
+function W(n, t, e2) {
+  return n && e2 && (n.__v = null, n.__k = n.__k && n.__k.map(function(n2) {
+    return W(n2, t, e2);
+  }), n.__c && n.__c.__P === t && (n.__e && e2.appendChild(n.__e), n.__c.__e = true, n.__c.__P = e2)), n;
+}
+function P() {
+  this.__u = 0, this.o = null, this.__b = null;
+}
+function j(n) {
+  var t = n.__.__c;
+  return t && t.__a && t.__a(n);
+}
+function z(n) {
+  var e2, r2, u2;
+  function o(o2) {
+    if (e2 || (e2 = n()).then(function(n2) {
+      r2 = n2.default || n2;
+    }, function(n2) {
+      u2 = n2;
+    }), u2) throw u2;
+    if (!r2) throw e2;
+    return createElement(r2, o2);
+  }
+  return o.displayName = "Lazy", o.__f = true, o;
+}
+function B() {
+  this.i = null, this.l = null;
+}
+options.unmount = function(n) {
+  var t = n.__c;
+  t && t.__R && t.__R(), t && 32 & n.__u && (n.type = null), U && U(n);
+}, (P.prototype = new Component()).__c = function(n, t) {
+  var e2 = t.__c, r2 = this;
+  null == r2.o && (r2.o = []), r2.o.push(e2);
+  var u2 = j(r2.__v), o = false, i = function() {
+    o || (o = true, e2.__R = null, u2 ? u2(l) : l());
+  };
+  e2.__R = i;
+  var l = function() {
+    if (!--r2.__u) {
+      if (r2.state.__a) {
+        var n2 = r2.state.__a;
+        r2.__v.__k[0] = W(n2, n2.__c.__P, n2.__c.__O);
+      }
+      var t2;
+      for (r2.setState({ __a: r2.__b = null }); t2 = r2.o.pop(); ) t2.forceUpdate();
+    }
+  };
+  r2.__u++ || 32 & t.__u || r2.setState({ __a: r2.__b = r2.__v.__k[0] }), n.then(i, i);
+}, P.prototype.componentWillUnmount = function() {
+  this.o = [];
+}, P.prototype.render = function(n, e2) {
+  if (this.__b) {
+    if (this.__v.__k) {
+      var r2 = document.createElement("div"), o = this.__v.__k[0].__c;
+      this.__v.__k[0] = V(this.__b, r2, o.__O = o.__P);
+    }
+    this.__b = null;
+  }
+  var i = e2.__a && createElement(Fragment, null, n.fallback);
+  return i && (i.__u &= -33), [createElement(Fragment, null, e2.__a ? null : n.children), i];
+};
+var H = function(n, t, e2) {
+  if (++e2[1] === e2[0] && n.l.delete(t), n.props.revealOrder && ("t" !== n.props.revealOrder[0] || !n.l.size)) for (e2 = n.i; e2; ) {
+    for (; e2.length > 3; ) e2.pop()();
+    if (e2[1] < e2[0]) break;
+    n.i = e2 = e2[2];
+  }
+};
+function Z(n) {
+  return this.getChildContext = function() {
+    return n.context;
+  }, n.children;
+}
+function Y(n) {
+  var e2 = this, r2 = n.h;
+  if (e2.componentWillUnmount = function() {
+    render(null, e2.v), e2.v = null, e2.h = null;
+  }, e2.h && e2.h !== r2 && e2.componentWillUnmount(), !e2.v) {
+    for (var u2 = e2.__v; null !== u2 && !u2.__m && null !== u2.__; ) u2 = u2.__;
+    e2.h = r2, e2.v = { nodeType: 1, parentNode: r2, childNodes: [], __k: { __m: u2.__m }, contains: function() {
+      return true;
+    }, insertBefore: function(n2, t) {
+      this.childNodes.push(n2), e2.h.insertBefore(n2, t);
+    }, removeChild: function(n2) {
+      this.childNodes.splice(this.childNodes.indexOf(n2) >>> 1, 1), e2.h.removeChild(n2);
+    } };
+  }
+  render(createElement(Z, { context: e2.context }, n.__v), e2.v);
+}
+function $(n, e2) {
+  var r2 = createElement(Y, { __v: n, h: e2 });
+  return r2.containerInfo = e2, r2;
+}
+(B.prototype = new Component()).__a = function(n) {
+  var t = this, e2 = j(t.__v), r2 = t.l.get(n);
+  return r2[0]++, function(u2) {
+    var o = function() {
+      t.props.revealOrder ? (r2.push(u2), H(t, n, r2)) : u2();
+    };
+    e2 ? e2(o) : o();
+  };
+}, B.prototype.render = function(n) {
+  this.i = null, this.l = /* @__PURE__ */ new Map();
+  var t = toChildArray(n.children);
+  n.revealOrder && "b" === n.revealOrder[0] && t.reverse();
+  for (var e2 = t.length; e2--; ) this.l.set(t[e2], this.i = [1, 0, this.i]);
+  return n.children;
+}, B.prototype.componentDidUpdate = B.prototype.componentDidMount = function() {
+  var n = this;
+  this.l.forEach(function(t, e2) {
+    H(n, e2, t);
+  });
+};
+var q = "undefined" != typeof Symbol && Symbol.for && Symbol.for("react.element") || 60103, G = /^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/, J = /^on(Ani|Tra|Tou|BeforeInp|Compo)/, K = /[A-Z0-9]/g, Q = "undefined" != typeof document, X = function(n) {
+  return ("undefined" != typeof Symbol && "symbol" == typeof Symbol() ? /fil|che|rad/ : /fil|che|ra/).test(n);
+};
+function nn(n, t, e2) {
+  return null == t.__k && (t.textContent = ""), render(n, t), "function" == typeof e2 && e2(), n ? n.__c : null;
+}
+function tn(n, t, e2) {
+  return hydrate(n, t), "function" == typeof e2 && e2(), n ? n.__c : null;
+}
+Component.prototype.isReactComponent = {}, ["componentWillMount", "componentWillReceiveProps", "componentWillUpdate"].forEach(function(t) {
+  Object.defineProperty(Component.prototype, t, { configurable: true, get: function() {
+    return this["UNSAFE_" + t];
+  }, set: function(n) {
+    Object.defineProperty(this, t, { configurable: true, writable: true, value: n });
+  } });
+});
+var en = options.event;
+function rn() {
+}
+function un() {
+  return this.cancelBubble;
+}
+function on() {
+  return this.defaultPrevented;
+}
+options.event = function(n) {
+  return en && (n = en(n)), n.persist = rn, n.isPropagationStopped = un, n.isDefaultPrevented = on, n.nativeEvent = n;
+};
+var ln, cn = { enumerable: false, configurable: true, get: function() {
+  return this.class;
+} }, fn = options.vnode;
+options.vnode = function(n) {
+  "string" == typeof n.type && function(n2) {
+    var t = n2.props, e2 = n2.type, u2 = {}, o = -1 === e2.indexOf("-");
+    for (var i in t) {
+      var l = t[i];
+      if (!("value" === i && "defaultValue" in t && null == l || Q && "children" === i && "noscript" === e2 || "class" === i || "className" === i)) {
+        var c = i.toLowerCase();
+        "defaultValue" === i && "value" in t && null == t.value ? i = "value" : "download" === i && true === l ? l = "" : "translate" === c && "no" === l ? l = false : "o" === c[0] && "n" === c[1] ? "ondoubleclick" === c ? i = "ondblclick" : "onchange" !== c || "input" !== e2 && "textarea" !== e2 || X(t.type) ? "onfocus" === c ? i = "onfocusin" : "onblur" === c ? i = "onfocusout" : J.test(i) && (i = c) : c = i = "oninput" : o && G.test(i) ? i = i.replace(K, "-$&").toLowerCase() : null === l && (l = void 0), "oninput" === c && u2[i = c] && (i = "oninputCapture"), u2[i] = l;
+      }
+    }
+    "select" == e2 && u2.multiple && Array.isArray(u2.value) && (u2.value = toChildArray(t.children).forEach(function(n3) {
+      n3.props.selected = -1 != u2.value.indexOf(n3.props.value);
+    })), "select" == e2 && null != u2.defaultValue && (u2.value = toChildArray(t.children).forEach(function(n3) {
+      n3.props.selected = u2.multiple ? -1 != u2.defaultValue.indexOf(n3.props.value) : u2.defaultValue == n3.props.value;
+    })), t.class && !t.className ? (u2.class = t.class, Object.defineProperty(u2, "className", cn)) : (t.className && !t.class || t.class && t.className) && (u2.class = u2.className = t.className), n2.props = u2;
+  }(n), n.$$typeof = q, fn && fn(n);
+};
+var an = options.__r;
+options.__r = function(n) {
+  an && an(n), ln = n.__c;
+};
+var sn = options.diffed;
+options.diffed = function(n) {
+  sn && sn(n);
+  var t = n.props, e2 = n.__e;
+  null != e2 && "textarea" === n.type && "value" in t && t.value !== e2.value && (e2.value = null == t.value ? "" : t.value), ln = null;
+};
+var hn = { ReactCurrentDispatcher: { current: { readContext: function(n) {
+  return ln.__n[n.__c].props.value;
+}, useCallback, useContext, useDebugValue, useDeferredValue: w, useEffect, useId, useImperativeHandle, useInsertionEffect: I, useLayoutEffect, useMemo, useReducer, useRef, useState, useSyncExternalStore: C, useTransition: k } } }, vn = "18.3.1";
+function dn(n) {
+  return createElement.bind(null, n);
+}
+function mn(n) {
+  return !!n && n.$$typeof === q;
+}
+function pn(n) {
+  return mn(n) && n.type === Fragment;
+}
+function yn(n) {
+  return !!n && !!n.displayName && ("string" == typeof n.displayName || n.displayName instanceof String) && n.displayName.startsWith("Memo(");
+}
+function _n(n) {
+  return mn(n) ? cloneElement.apply(null, arguments) : n;
+}
+function bn(n) {
+  return !!n.__k && (render(null, n), true);
+}
+function Sn(n) {
+  return n && (n.base || 1 === n.nodeType && n) || null;
+}
+var gn = function(n, t) {
+  return n(t);
+}, En = function(n, t) {
+  return n(t);
+}, Cn = Fragment, xn = mn, Rn = { useState, useId, useReducer, useEffect, useLayoutEffect, useInsertionEffect: I, useTransition: k, useDeferredValue: w, useSyncExternalStore: C, startTransition: R, useRef, useImperativeHandle, useMemo, useCallback, useContext, useDebugValue, version: "18.3.1", Children: O, render: nn, hydrate: tn, unmountComponentAtNode: bn, createPortal: $, createElement, createContext, createFactory: dn, cloneElement: _n, createRef, Fragment, isValidElement: mn, isElement: xn, isFragment: pn, isMemo: yn, findDOMNode: Sn, Component, PureComponent: N, memo: M, forwardRef: D, flushSync: En, unstable_batchedUpdates: gn, StrictMode: Cn, Suspense: P, SuspenseList: B, lazy: z, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: hn };
+const compat_module = /* @__PURE__ */ _mergeNamespaces({
+  __proto__: null,
+  Children: O,
+  Component,
+  Fragment,
+  PureComponent: N,
+  StrictMode: Cn,
+  Suspense: P,
+  SuspenseList: B,
+  __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: hn,
+  cloneElement: _n,
+  createContext,
+  createElement,
+  createFactory: dn,
+  createPortal: $,
+  createRef,
+  default: Rn,
+  findDOMNode: Sn,
+  flushSync: En,
+  forwardRef: D,
+  hydrate: tn,
+  isElement: xn,
+  isFragment: pn,
+  isMemo: yn,
+  isValidElement: mn,
+  lazy: z,
+  memo: M,
+  render: nn,
+  startTransition: R,
+  unmountComponentAtNode: bn,
+  unstable_batchedUpdates: gn,
+  useDeferredValue: w,
+  useInsertionEffect: I,
+  useSyncExternalStore: C,
+  useTransition: k,
+  version: vn
+}, [hooks]);
+var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
+function getDefaultExportFromCjs(x2) {
+  return x2 && x2.__esModule && Object.prototype.hasOwnProperty.call(x2, "default") ? x2["default"] : x2;
+}
+function getAugmentedNamespace(n) {
+  if (n.__esModule) return n;
+  var f2 = n.default;
+  if (typeof f2 == "function") {
+    var a = function a2() {
+      if (this instanceof a2) {
+        return Reflect.construct(f2, arguments, this.constructor);
+      }
+      return f2.apply(this, arguments);
+    };
+    a.prototype = f2.prototype;
+  } else a = {};
+  Object.defineProperty(a, "__esModule", { value: true });
+  Object.keys(n).forEach(function(k2) {
+    var d = Object.getOwnPropertyDescriptor(n, k2);
+    Object.defineProperty(a, k2, d.get ? d : {
+      enumerable: true,
+      get: function() {
+        return n[k2];
+      }
+    });
+  });
+  return a;
+}
+var cjs = { exports: {} };
+var Draggable$2 = {};
+const require$$2 = /* @__PURE__ */ getAugmentedNamespace(compat_module);
+var propTypes = { exports: {} };
+var reactIs = { exports: {} };
+var reactIs_production_min = {};
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var hasRequiredReactIs_production_min;
+function requireReactIs_production_min() {
+  if (hasRequiredReactIs_production_min) return reactIs_production_min;
+  hasRequiredReactIs_production_min = 1;
+  var b = "function" === typeof Symbol && Symbol.for, c = b ? Symbol.for("react.element") : 60103, d = b ? Symbol.for("react.portal") : 60106, e2 = b ? Symbol.for("react.fragment") : 60107, f2 = b ? Symbol.for("react.strict_mode") : 60108, g2 = b ? Symbol.for("react.profiler") : 60114, h = b ? Symbol.for("react.provider") : 60109, k2 = b ? Symbol.for("react.context") : 60110, l = b ? Symbol.for("react.async_mode") : 60111, m = b ? Symbol.for("react.concurrent_mode") : 60111, n = b ? Symbol.for("react.forward_ref") : 60112, p = b ? Symbol.for("react.suspense") : 60113, q2 = b ? Symbol.for("react.suspense_list") : 60120, r2 = b ? Symbol.for("react.memo") : 60115, t = b ? Symbol.for("react.lazy") : 60116, v = b ? Symbol.for("react.block") : 60121, w2 = b ? Symbol.for("react.fundamental") : 60117, x2 = b ? Symbol.for("react.responder") : 60118, y = b ? Symbol.for("react.scope") : 60119;
+  function z2(a) {
+    if ("object" === typeof a && null !== a) {
+      var u2 = a.$$typeof;
+      switch (u2) {
+        case c:
+          switch (a = a.type, a) {
+            case l:
+            case m:
+            case e2:
+            case g2:
+            case f2:
+            case p:
+              return a;
+            default:
+              switch (a = a && a.$$typeof, a) {
+                case k2:
+                case n:
+                case t:
+                case r2:
+                case h:
+                  return a;
+                default:
+                  return u2;
+              }
+          }
+        case d:
+          return u2;
+      }
+    }
+  }
+  function A2(a) {
+    return z2(a) === m;
+  }
+  reactIs_production_min.AsyncMode = l;
+  reactIs_production_min.ConcurrentMode = m;
+  reactIs_production_min.ContextConsumer = k2;
+  reactIs_production_min.ContextProvider = h;
+  reactIs_production_min.Element = c;
+  reactIs_production_min.ForwardRef = n;
+  reactIs_production_min.Fragment = e2;
+  reactIs_production_min.Lazy = t;
+  reactIs_production_min.Memo = r2;
+  reactIs_production_min.Portal = d;
+  reactIs_production_min.Profiler = g2;
+  reactIs_production_min.StrictMode = f2;
+  reactIs_production_min.Suspense = p;
+  reactIs_production_min.isAsyncMode = function(a) {
+    return A2(a) || z2(a) === l;
+  };
+  reactIs_production_min.isConcurrentMode = A2;
+  reactIs_production_min.isContextConsumer = function(a) {
+    return z2(a) === k2;
+  };
+  reactIs_production_min.isContextProvider = function(a) {
+    return z2(a) === h;
+  };
+  reactIs_production_min.isElement = function(a) {
+    return "object" === typeof a && null !== a && a.$$typeof === c;
+  };
+  reactIs_production_min.isForwardRef = function(a) {
+    return z2(a) === n;
+  };
+  reactIs_production_min.isFragment = function(a) {
+    return z2(a) === e2;
+  };
+  reactIs_production_min.isLazy = function(a) {
+    return z2(a) === t;
+  };
+  reactIs_production_min.isMemo = function(a) {
+    return z2(a) === r2;
+  };
+  reactIs_production_min.isPortal = function(a) {
+    return z2(a) === d;
+  };
+  reactIs_production_min.isProfiler = function(a) {
+    return z2(a) === g2;
+  };
+  reactIs_production_min.isStrictMode = function(a) {
+    return z2(a) === f2;
+  };
+  reactIs_production_min.isSuspense = function(a) {
+    return z2(a) === p;
+  };
+  reactIs_production_min.isValidElementType = function(a) {
+    return "string" === typeof a || "function" === typeof a || a === e2 || a === m || a === g2 || a === f2 || a === p || a === q2 || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r2 || a.$$typeof === h || a.$$typeof === k2 || a.$$typeof === n || a.$$typeof === w2 || a.$$typeof === x2 || a.$$typeof === y || a.$$typeof === v);
+  };
+  reactIs_production_min.typeOf = z2;
+  return reactIs_production_min;
+}
+var reactIs_development = {};
+/** @license React v16.13.1
+ * react-is.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var hasRequiredReactIs_development;
+function requireReactIs_development() {
+  if (hasRequiredReactIs_development) return reactIs_development;
+  hasRequiredReactIs_development = 1;
+  if (process.env.NODE_ENV !== "production") {
+    (function() {
+      var hasSymbol = typeof Symbol === "function" && Symbol.for;
+      var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for("react.element") : 60103;
+      var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for("react.portal") : 60106;
+      var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for("react.fragment") : 60107;
+      var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for("react.strict_mode") : 60108;
+      var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for("react.profiler") : 60114;
+      var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for("react.provider") : 60109;
+      var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for("react.context") : 60110;
+      var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for("react.async_mode") : 60111;
+      var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for("react.concurrent_mode") : 60111;
+      var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for("react.forward_ref") : 60112;
+      var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for("react.suspense") : 60113;
+      var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for("react.suspense_list") : 60120;
+      var REACT_MEMO_TYPE = hasSymbol ? Symbol.for("react.memo") : 60115;
+      var REACT_LAZY_TYPE = hasSymbol ? Symbol.for("react.lazy") : 60116;
+      var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for("react.block") : 60121;
+      var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for("react.fundamental") : 60117;
+      var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for("react.responder") : 60118;
+      var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for("react.scope") : 60119;
+      function isValidElementType(type) {
+        return typeof type === "string" || typeof type === "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+        type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === "object" && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
+      }
+      function typeOf(object) {
+        if (typeof object === "object" && object !== null) {
+          var $$typeof = object.$$typeof;
+          switch ($$typeof) {
+            case REACT_ELEMENT_TYPE:
+              var type = object.type;
+              switch (type) {
+                case REACT_ASYNC_MODE_TYPE:
+                case REACT_CONCURRENT_MODE_TYPE:
+                case REACT_FRAGMENT_TYPE:
+                case REACT_PROFILER_TYPE:
+                case REACT_STRICT_MODE_TYPE:
+                case REACT_SUSPENSE_TYPE:
+                  return type;
+                default:
+                  var $$typeofType = type && type.$$typeof;
+                  switch ($$typeofType) {
+                    case REACT_CONTEXT_TYPE:
+                    case REACT_FORWARD_REF_TYPE:
+                    case REACT_LAZY_TYPE:
+                    case REACT_MEMO_TYPE:
+                    case REACT_PROVIDER_TYPE:
+                      return $$typeofType;
+                    default:
+                      return $$typeof;
+                  }
+              }
+            case REACT_PORTAL_TYPE:
+              return $$typeof;
+          }
+        }
+        return void 0;
+      }
+      var AsyncMode = REACT_ASYNC_MODE_TYPE;
+      var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
+      var ContextConsumer = REACT_CONTEXT_TYPE;
+      var ContextProvider = REACT_PROVIDER_TYPE;
+      var Element = REACT_ELEMENT_TYPE;
+      var ForwardRef = REACT_FORWARD_REF_TYPE;
+      var Fragment2 = REACT_FRAGMENT_TYPE;
+      var Lazy = REACT_LAZY_TYPE;
+      var Memo = REACT_MEMO_TYPE;
+      var Portal = REACT_PORTAL_TYPE;
+      var Profiler = REACT_PROFILER_TYPE;
+      var StrictMode = REACT_STRICT_MODE_TYPE;
+      var Suspense = REACT_SUSPENSE_TYPE;
+      var hasWarnedAboutDeprecatedIsAsyncMode = false;
+      function isAsyncMode(object) {
+        {
+          if (!hasWarnedAboutDeprecatedIsAsyncMode) {
+            hasWarnedAboutDeprecatedIsAsyncMode = true;
+            console["warn"]("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.");
+          }
+        }
+        return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
+      }
+      function isConcurrentMode(object) {
+        return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
+      }
+      function isContextConsumer(object) {
+        return typeOf(object) === REACT_CONTEXT_TYPE;
+      }
+      function isContextProvider(object) {
+        return typeOf(object) === REACT_PROVIDER_TYPE;
+      }
+      function isElement(object) {
+        return typeof object === "object" && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
+      }
+      function isForwardRef(object) {
+        return typeOf(object) === REACT_FORWARD_REF_TYPE;
+      }
+      function isFragment(object) {
+        return typeOf(object) === REACT_FRAGMENT_TYPE;
+      }
+      function isLazy(object) {
+        return typeOf(object) === REACT_LAZY_TYPE;
+      }
+      function isMemo(object) {
+        return typeOf(object) === REACT_MEMO_TYPE;
+      }
+      function isPortal(object) {
+        return typeOf(object) === REACT_PORTAL_TYPE;
+      }
+      function isProfiler(object) {
+        return typeOf(object) === REACT_PROFILER_TYPE;
+      }
+      function isStrictMode(object) {
+        return typeOf(object) === REACT_STRICT_MODE_TYPE;
+      }
+      function isSuspense(object) {
+        return typeOf(object) === REACT_SUSPENSE_TYPE;
+      }
+      reactIs_development.AsyncMode = AsyncMode;
+      reactIs_development.ConcurrentMode = ConcurrentMode;
+      reactIs_development.ContextConsumer = ContextConsumer;
+      reactIs_development.ContextProvider = ContextProvider;
+      reactIs_development.Element = Element;
+      reactIs_development.ForwardRef = ForwardRef;
+      reactIs_development.Fragment = Fragment2;
+      reactIs_development.Lazy = Lazy;
+      reactIs_development.Memo = Memo;
+      reactIs_development.Portal = Portal;
+      reactIs_development.Profiler = Profiler;
+      reactIs_development.StrictMode = StrictMode;
+      reactIs_development.Suspense = Suspense;
+      reactIs_development.isAsyncMode = isAsyncMode;
+      reactIs_development.isConcurrentMode = isConcurrentMode;
+      reactIs_development.isContextConsumer = isContextConsumer;
+      reactIs_development.isContextProvider = isContextProvider;
+      reactIs_development.isElement = isElement;
+      reactIs_development.isForwardRef = isForwardRef;
+      reactIs_development.isFragment = isFragment;
+      reactIs_development.isLazy = isLazy;
+      reactIs_development.isMemo = isMemo;
+      reactIs_development.isPortal = isPortal;
+      reactIs_development.isProfiler = isProfiler;
+      reactIs_development.isStrictMode = isStrictMode;
+      reactIs_development.isSuspense = isSuspense;
+      reactIs_development.isValidElementType = isValidElementType;
+      reactIs_development.typeOf = typeOf;
+    })();
+  }
+  return reactIs_development;
+}
+var hasRequiredReactIs;
+function requireReactIs() {
+  if (hasRequiredReactIs) return reactIs.exports;
+  hasRequiredReactIs = 1;
+  if (process.env.NODE_ENV === "production") {
+    reactIs.exports = requireReactIs_production_min();
+  } else {
+    reactIs.exports = requireReactIs_development();
+  }
+  return reactIs.exports;
+}
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+var objectAssign;
+var hasRequiredObjectAssign;
+function requireObjectAssign() {
+  if (hasRequiredObjectAssign) return objectAssign;
+  hasRequiredObjectAssign = 1;
+  var getOwnPropertySymbols = Object.getOwnPropertySymbols;
+  var hasOwnProperty = Object.prototype.hasOwnProperty;
+  var propIsEnumerable = Object.prototype.propertyIsEnumerable;
+  function toObject(val) {
+    if (val === null || val === void 0) {
+      throw new TypeError("Object.assign cannot be called with null or undefined");
+    }
+    return Object(val);
+  }
+  function shouldUseNative() {
+    try {
+      if (!Object.assign) {
+        return false;
+      }
+      var test1 = new String("abc");
+      test1[5] = "de";
+      if (Object.getOwnPropertyNames(test1)[0] === "5") {
+        return false;
+      }
+      var test2 = {};
+      for (var i = 0; i < 10; i++) {
+        test2["_" + String.fromCharCode(i)] = i;
+      }
+      var order2 = Object.getOwnPropertyNames(test2).map(function(n) {
+        return test2[n];
+      });
+      if (order2.join("") !== "0123456789") {
+        return false;
+      }
+      var test3 = {};
+      "abcdefghijklmnopqrst".split("").forEach(function(letter) {
+        test3[letter] = letter;
+      });
+      if (Object.keys(Object.assign({}, test3)).join("") !== "abcdefghijklmnopqrst") {
+        return false;
+      }
+      return true;
+    } catch (err) {
+      return false;
+    }
+  }
+  objectAssign = shouldUseNative() ? Object.assign : function(target, source) {
+    var from;
+    var to = toObject(target);
+    var symbols;
+    for (var s = 1; s < arguments.length; s++) {
+      from = Object(arguments[s]);
+      for (var key in from) {
+        if (hasOwnProperty.call(from, key)) {
+          to[key] = from[key];
+        }
+      }
+      if (getOwnPropertySymbols) {
+        symbols = getOwnPropertySymbols(from);
+        for (var i = 0; i < symbols.length; i++) {
+          if (propIsEnumerable.call(from, symbols[i])) {
+            to[symbols[i]] = from[symbols[i]];
+          }
+        }
+      }
+    }
+    return to;
+  };
+  return objectAssign;
+}
+var ReactPropTypesSecret_1;
+var hasRequiredReactPropTypesSecret;
+function requireReactPropTypesSecret() {
+  if (hasRequiredReactPropTypesSecret) return ReactPropTypesSecret_1;
+  hasRequiredReactPropTypesSecret = 1;
+  var ReactPropTypesSecret = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
+  ReactPropTypesSecret_1 = ReactPropTypesSecret;
+  return ReactPropTypesSecret_1;
+}
+var has;
+var hasRequiredHas;
+function requireHas() {
+  if (hasRequiredHas) return has;
+  hasRequiredHas = 1;
+  has = Function.call.bind(Object.prototype.hasOwnProperty);
+  return has;
+}
+var checkPropTypes_1;
+var hasRequiredCheckPropTypes;
+function requireCheckPropTypes() {
+  if (hasRequiredCheckPropTypes) return checkPropTypes_1;
+  hasRequiredCheckPropTypes = 1;
+  var printWarning = function() {
+  };
+  if (process.env.NODE_ENV !== "production") {
+    var ReactPropTypesSecret = requireReactPropTypesSecret();
+    var loggedTypeFailures = {};
+    var has2 = requireHas();
+    printWarning = function(text) {
+      var message = "Warning: " + text;
+      if (typeof console !== "undefined") {
+        console.error(message);
+      }
+      try {
+        throw new Error(message);
+      } catch (x2) {
+      }
+    };
+  }
+  function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
+    if (process.env.NODE_ENV !== "production") {
+      for (var typeSpecName in typeSpecs) {
+        if (has2(typeSpecs, typeSpecName)) {
+          var error;
+          try {
+            if (typeof typeSpecs[typeSpecName] !== "function") {
+              var err = Error(
+                (componentName || "React class") + ": " + location + " type `" + typeSpecName + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof typeSpecs[typeSpecName] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
+              );
+              err.name = "Invariant Violation";
+              throw err;
+            }
+            error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret);
+          } catch (ex) {
+            error = ex;
+          }
+          if (error && !(error instanceof Error)) {
+            printWarning(
+              (componentName || "React class") + ": type specification of " + location + " `" + typeSpecName + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof error + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
+            );
+          }
+          if (error instanceof Error && !(error.message in loggedTypeFailures)) {
+            loggedTypeFailures[error.message] = true;
+            var stack = getStack ? getStack() : "";
+            printWarning(
+              "Failed " + location + " type: " + error.message + (stack != null ? stack : "")
+            );
+          }
+        }
+      }
+    }
+  }
+  checkPropTypes.resetWarningCache = function() {
+    if (process.env.NODE_ENV !== "production") {
+      loggedTypeFailures = {};
+    }
+  };
+  checkPropTypes_1 = checkPropTypes;
+  return checkPropTypes_1;
+}
+var factoryWithTypeCheckers;
+var hasRequiredFactoryWithTypeCheckers;
+function requireFactoryWithTypeCheckers() {
+  if (hasRequiredFactoryWithTypeCheckers) return factoryWithTypeCheckers;
+  hasRequiredFactoryWithTypeCheckers = 1;
+  var ReactIs = requireReactIs();
+  var assign = requireObjectAssign();
+  var ReactPropTypesSecret = requireReactPropTypesSecret();
+  var has2 = requireHas();
+  var checkPropTypes = requireCheckPropTypes();
+  var printWarning = function() {
+  };
+  if (process.env.NODE_ENV !== "production") {
+    printWarning = function(text) {
+      var message = "Warning: " + text;
+      if (typeof console !== "undefined") {
+        console.error(message);
+      }
+      try {
+        throw new Error(message);
+      } catch (x2) {
+      }
+    };
+  }
+  function emptyFunctionThatReturnsNull() {
+    return null;
+  }
+  factoryWithTypeCheckers = function(isValidElement, throwOnDirectAccess) {
+    var ITERATOR_SYMBOL = typeof Symbol === "function" && Symbol.iterator;
+    var FAUX_ITERATOR_SYMBOL = "@@iterator";
+    function getIteratorFn(maybeIterable) {
+      var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
+      if (typeof iteratorFn === "function") {
+        return iteratorFn;
+      }
+    }
+    var ANONYMOUS = "<<anonymous>>";
+    var ReactPropTypes = {
+      array: createPrimitiveTypeChecker("array"),
+      bigint: createPrimitiveTypeChecker("bigint"),
+      bool: createPrimitiveTypeChecker("boolean"),
+      func: createPrimitiveTypeChecker("function"),
+      number: createPrimitiveTypeChecker("number"),
+      object: createPrimitiveTypeChecker("object"),
+      string: createPrimitiveTypeChecker("string"),
+      symbol: createPrimitiveTypeChecker("symbol"),
+      any: createAnyTypeChecker(),
+      arrayOf: createArrayOfTypeChecker,
+      element: createElementTypeChecker(),
+      elementType: createElementTypeTypeChecker(),
+      instanceOf: createInstanceTypeChecker,
+      node: createNodeChecker(),
+      objectOf: createObjectOfTypeChecker,
+      oneOf: createEnumTypeChecker,
+      oneOfType: createUnionTypeChecker,
+      shape: createShapeTypeChecker,
+      exact: createStrictShapeTypeChecker
+    };
+    function is(x2, y) {
+      if (x2 === y) {
+        return x2 !== 0 || 1 / x2 === 1 / y;
+      } else {
+        return x2 !== x2 && y !== y;
+      }
+    }
+    function PropTypeError(message, data) {
+      this.message = message;
+      this.data = data && typeof data === "object" ? data : {};
+      this.stack = "";
+    }
+    PropTypeError.prototype = Error.prototype;
+    function createChainableTypeChecker(validate) {
+      if (process.env.NODE_ENV !== "production") {
+        var manualPropTypeCallCache = {};
+        var manualPropTypeWarningCount = 0;
+      }
+      function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {
+        componentName = componentName || ANONYMOUS;
+        propFullName = propFullName || propName;
+        if (secret !== ReactPropTypesSecret) {
+          if (throwOnDirectAccess) {
+            var err = new Error(
+              "Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"
+            );
+            err.name = "Invariant Violation";
+            throw err;
+          } else if (process.env.NODE_ENV !== "production" && typeof console !== "undefined") {
+            var cacheKey = componentName + ":" + propName;
+            if (!manualPropTypeCallCache[cacheKey] && // Avoid spamming the console because they are often not actionable except for lib authors
+            manualPropTypeWarningCount < 3) {
+              printWarning(
+                "You are manually calling a React.PropTypes validation function for the `" + propFullName + "` prop on `" + componentName + "`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."
+              );
+              manualPropTypeCallCache[cacheKey] = true;
+              manualPropTypeWarningCount++;
+            }
+          }
+        }
+        if (props[propName] == null) {
+          if (isRequired) {
+            if (props[propName] === null) {
+              return new PropTypeError("The " + location + " `" + propFullName + "` is marked as required " + ("in `" + componentName + "`, but its value is `null`."));
+            }
+            return new PropTypeError("The " + location + " `" + propFullName + "` is marked as required in " + ("`" + componentName + "`, but its value is `undefined`."));
+          }
+          return null;
+        } else {
+          return validate(props, propName, componentName, location, propFullName);
+        }
+      }
+      var chainedCheckType = checkType.bind(null, false);
+      chainedCheckType.isRequired = checkType.bind(null, true);
+      return chainedCheckType;
+    }
+    function createPrimitiveTypeChecker(expectedType) {
+      function validate(props, propName, componentName, location, propFullName, secret) {
+        var propValue = props[propName];
+        var propType = getPropType(propValue);
+        if (propType !== expectedType) {
+          var preciseType = getPreciseType(propValue);
+          return new PropTypeError(
+            "Invalid " + location + " `" + propFullName + "` of type " + ("`" + preciseType + "` supplied to `" + componentName + "`, expected ") + ("`" + expectedType + "`."),
+            { expectedType }
+          );
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createAnyTypeChecker() {
+      return createChainableTypeChecker(emptyFunctionThatReturnsNull);
+    }
+    function createArrayOfTypeChecker(typeChecker) {
+      function validate(props, propName, componentName, location, propFullName) {
+        if (typeof typeChecker !== "function") {
+          return new PropTypeError("Property `" + propFullName + "` of component `" + componentName + "` has invalid PropType notation inside arrayOf.");
+        }
+        var propValue = props[propName];
+        if (!Array.isArray(propValue)) {
+          var propType = getPropType(propValue);
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type " + ("`" + propType + "` supplied to `" + componentName + "`, expected an array."));
+        }
+        for (var i = 0; i < propValue.length; i++) {
+          var error = typeChecker(propValue, i, componentName, location, propFullName + "[" + i + "]", ReactPropTypesSecret);
+          if (error instanceof Error) {
+            return error;
+          }
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createElementTypeChecker() {
+      function validate(props, propName, componentName, location, propFullName) {
+        var propValue = props[propName];
+        if (!isValidElement(propValue)) {
+          var propType = getPropType(propValue);
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type " + ("`" + propType + "` supplied to `" + componentName + "`, expected a single ReactElement."));
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createElementTypeTypeChecker() {
+      function validate(props, propName, componentName, location, propFullName) {
+        var propValue = props[propName];
+        if (!ReactIs.isValidElementType(propValue)) {
+          var propType = getPropType(propValue);
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type " + ("`" + propType + "` supplied to `" + componentName + "`, expected a single ReactElement type."));
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createInstanceTypeChecker(expectedClass) {
+      function validate(props, propName, componentName, location, propFullName) {
+        if (!(props[propName] instanceof expectedClass)) {
+          var expectedClassName = expectedClass.name || ANONYMOUS;
+          var actualClassName = getClassName(props[propName]);
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type " + ("`" + actualClassName + "` supplied to `" + componentName + "`, expected ") + ("instance of `" + expectedClassName + "`."));
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createEnumTypeChecker(expectedValues) {
+      if (!Array.isArray(expectedValues)) {
+        if (process.env.NODE_ENV !== "production") {
+          if (arguments.length > 1) {
+            printWarning(
+              "Invalid arguments supplied to oneOf, expected an array, got " + arguments.length + " arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."
+            );
+          } else {
+            printWarning("Invalid argument supplied to oneOf, expected an array.");
+          }
+        }
+        return emptyFunctionThatReturnsNull;
+      }
+      function validate(props, propName, componentName, location, propFullName) {
+        var propValue = props[propName];
+        for (var i = 0; i < expectedValues.length; i++) {
+          if (is(propValue, expectedValues[i])) {
+            return null;
+          }
+        }
+        var valuesString = JSON.stringify(expectedValues, function replacer(key, value) {
+          var type = getPreciseType(value);
+          if (type === "symbol") {
+            return String(value);
+          }
+          return value;
+        });
+        return new PropTypeError("Invalid " + location + " `" + propFullName + "` of value `" + String(propValue) + "` " + ("supplied to `" + componentName + "`, expected one of " + valuesString + "."));
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createObjectOfTypeChecker(typeChecker) {
+      function validate(props, propName, componentName, location, propFullName) {
+        if (typeof typeChecker !== "function") {
+          return new PropTypeError("Property `" + propFullName + "` of component `" + componentName + "` has invalid PropType notation inside objectOf.");
+        }
+        var propValue = props[propName];
+        var propType = getPropType(propValue);
+        if (propType !== "object") {
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type " + ("`" + propType + "` supplied to `" + componentName + "`, expected an object."));
+        }
+        for (var key in propValue) {
+          if (has2(propValue, key)) {
+            var error = typeChecker(propValue, key, componentName, location, propFullName + "." + key, ReactPropTypesSecret);
+            if (error instanceof Error) {
+              return error;
+            }
+          }
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createUnionTypeChecker(arrayOfTypeCheckers) {
+      if (!Array.isArray(arrayOfTypeCheckers)) {
+        process.env.NODE_ENV !== "production" ? printWarning("Invalid argument supplied to oneOfType, expected an instance of array.") : void 0;
+        return emptyFunctionThatReturnsNull;
+      }
+      for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
+        var checker = arrayOfTypeCheckers[i];
+        if (typeof checker !== "function") {
+          printWarning(
+            "Invalid argument supplied to oneOfType. Expected an array of check functions, but received " + getPostfixForTypeWarning(checker) + " at index " + i + "."
+          );
+          return emptyFunctionThatReturnsNull;
+        }
+      }
+      function validate(props, propName, componentName, location, propFullName) {
+        var expectedTypes = [];
+        for (var i2 = 0; i2 < arrayOfTypeCheckers.length; i2++) {
+          var checker2 = arrayOfTypeCheckers[i2];
+          var checkerResult = checker2(props, propName, componentName, location, propFullName, ReactPropTypesSecret);
+          if (checkerResult == null) {
+            return null;
+          }
+          if (checkerResult.data && has2(checkerResult.data, "expectedType")) {
+            expectedTypes.push(checkerResult.data.expectedType);
+          }
+        }
+        var expectedTypesMessage = expectedTypes.length > 0 ? ", expected one of type [" + expectedTypes.join(", ") + "]" : "";
+        return new PropTypeError("Invalid " + location + " `" + propFullName + "` supplied to " + ("`" + componentName + "`" + expectedTypesMessage + "."));
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createNodeChecker() {
+      function validate(props, propName, componentName, location, propFullName) {
+        if (!isNode(props[propName])) {
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` supplied to " + ("`" + componentName + "`, expected a ReactNode."));
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function invalidValidatorError(componentName, location, propFullName, key, type) {
+      return new PropTypeError(
+        (componentName || "React class") + ": " + location + " type `" + propFullName + "." + key + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + type + "`."
+      );
+    }
+    function createShapeTypeChecker(shapeTypes) {
+      function validate(props, propName, componentName, location, propFullName) {
+        var propValue = props[propName];
+        var propType = getPropType(propValue);
+        if (propType !== "object") {
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type `" + propType + "` " + ("supplied to `" + componentName + "`, expected `object`."));
+        }
+        for (var key in shapeTypes) {
+          var checker = shapeTypes[key];
+          if (typeof checker !== "function") {
+            return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
+          }
+          var error = checker(propValue, key, componentName, location, propFullName + "." + key, ReactPropTypesSecret);
+          if (error) {
+            return error;
+          }
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function createStrictShapeTypeChecker(shapeTypes) {
+      function validate(props, propName, componentName, location, propFullName) {
+        var propValue = props[propName];
+        var propType = getPropType(propValue);
+        if (propType !== "object") {
+          return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type `" + propType + "` " + ("supplied to `" + componentName + "`, expected `object`."));
+        }
+        var allKeys = assign({}, props[propName], shapeTypes);
+        for (var key in allKeys) {
+          var checker = shapeTypes[key];
+          if (has2(shapeTypes, key) && typeof checker !== "function") {
+            return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
+          }
+          if (!checker) {
+            return new PropTypeError(
+              "Invalid " + location + " `" + propFullName + "` key `" + key + "` supplied to `" + componentName + "`.\nBad object: " + JSON.stringify(props[propName], null, "  ") + "\nValid keys: " + JSON.stringify(Object.keys(shapeTypes), null, "  ")
+            );
+          }
+          var error = checker(propValue, key, componentName, location, propFullName + "." + key, ReactPropTypesSecret);
+          if (error) {
+            return error;
+          }
+        }
+        return null;
+      }
+      return createChainableTypeChecker(validate);
+    }
+    function isNode(propValue) {
+      switch (typeof propValue) {
+        case "number":
+        case "string":
+        case "undefined":
+          return true;
+        case "boolean":
+          return !propValue;
+        case "object":
+          if (Array.isArray(propValue)) {
+            return propValue.every(isNode);
+          }
+          if (propValue === null || isValidElement(propValue)) {
+            return true;
+          }
+          var iteratorFn = getIteratorFn(propValue);
+          if (iteratorFn) {
+            var iterator = iteratorFn.call(propValue);
+            var step;
+            if (iteratorFn !== propValue.entries) {
+              while (!(step = iterator.next()).done) {
+                if (!isNode(step.value)) {
+                  return false;
+                }
+              }
+            } else {
+              while (!(step = iterator.next()).done) {
+                var entry = step.value;
+                if (entry) {
+                  if (!isNode(entry[1])) {
+                    return false;
+                  }
+                }
+              }
+            }
+          } else {
+            return false;
+          }
+          return true;
+        default:
+          return false;
+      }
+    }
+    function isSymbol(propType, propValue) {
+      if (propType === "symbol") {
+        return true;
+      }
+      if (!propValue) {
+        return false;
+      }
+      if (propValue["@@toStringTag"] === "Symbol") {
+        return true;
+      }
+      if (typeof Symbol === "function" && propValue instanceof Symbol) {
+        return true;
+      }
+      return false;
+    }
+    function getPropType(propValue) {
+      var propType = typeof propValue;
+      if (Array.isArray(propValue)) {
+        return "array";
+      }
+      if (propValue instanceof RegExp) {
+        return "object";
+      }
+      if (isSymbol(propType, propValue)) {
+        return "symbol";
+      }
+      return propType;
+    }
+    function getPreciseType(propValue) {
+      if (typeof propValue === "undefined" || propValue === null) {
+        return "" + propValue;
+      }
+      var propType = getPropType(propValue);
+      if (propType === "object") {
+        if (propValue instanceof Date) {
+          return "date";
+        } else if (propValue instanceof RegExp) {
+          return "regexp";
+        }
+      }
+      return propType;
+    }
+    function getPostfixForTypeWarning(value) {
+      var type = getPreciseType(value);
+      switch (type) {
+        case "array":
+        case "object":
+          return "an " + type;
+        case "boolean":
+        case "date":
+        case "regexp":
+          return "a " + type;
+        default:
+          return type;
+      }
+    }
+    function getClassName(propValue) {
+      if (!propValue.constructor || !propValue.constructor.name) {
+        return ANONYMOUS;
+      }
+      return propValue.constructor.name;
+    }
+    ReactPropTypes.checkPropTypes = checkPropTypes;
+    ReactPropTypes.resetWarningCache = checkPropTypes.resetWarningCache;
+    ReactPropTypes.PropTypes = ReactPropTypes;
+    return ReactPropTypes;
+  };
+  return factoryWithTypeCheckers;
+}
+var factoryWithThrowingShims;
+var hasRequiredFactoryWithThrowingShims;
+function requireFactoryWithThrowingShims() {
+  if (hasRequiredFactoryWithThrowingShims) return factoryWithThrowingShims;
+  hasRequiredFactoryWithThrowingShims = 1;
+  var ReactPropTypesSecret = requireReactPropTypesSecret();
+  function emptyFunction() {
+  }
+  function emptyFunctionWithReset() {
+  }
+  emptyFunctionWithReset.resetWarningCache = emptyFunction;
+  factoryWithThrowingShims = function() {
+    function shim(props, propName, componentName, location, propFullName, secret) {
+      if (secret === ReactPropTypesSecret) {
+        return;
+      }
+      var err = new Error(
+        "Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types"
+      );
+      err.name = "Invariant Violation";
+      throw err;
+    }
+    shim.isRequired = shim;
+    function getShim() {
+      return shim;
+    }
+    var ReactPropTypes = {
+      array: shim,
+      bigint: shim,
+      bool: shim,
+      func: shim,
+      number: shim,
+      object: shim,
+      string: shim,
+      symbol: shim,
+      any: shim,
+      arrayOf: getShim,
+      element: shim,
+      elementType: shim,
+      instanceOf: getShim,
+      node: shim,
+      objectOf: getShim,
+      oneOf: getShim,
+      oneOfType: getShim,
+      shape: getShim,
+      exact: getShim,
+      checkPropTypes: emptyFunctionWithReset,
+      resetWarningCache: emptyFunction
+    };
+    ReactPropTypes.PropTypes = ReactPropTypes;
+    return ReactPropTypes;
+  };
+  return factoryWithThrowingShims;
+}
+if (process.env.NODE_ENV !== "production") {
+  var ReactIs = requireReactIs();
+  var throwOnDirectAccess = true;
+  propTypes.exports = requireFactoryWithTypeCheckers()(ReactIs.isElement, throwOnDirectAccess);
+} else {
+  propTypes.exports = requireFactoryWithThrowingShims()();
+}
+var propTypesExports = propTypes.exports;
+var clsx = { exports: {} };
+function r(e2) {
+  var o, t, f2 = "";
+  if ("string" == typeof e2 || "number" == typeof e2) f2 += e2;
+  else if ("object" == typeof e2) if (Array.isArray(e2)) {
+    var n = e2.length;
+    for (o = 0; o < n; o++) e2[o] && (t = r(e2[o])) && (f2 && (f2 += " "), f2 += t);
+  } else for (t in e2) e2[t] && (f2 && (f2 += " "), f2 += t);
+  return f2;
+}
+function e() {
+  for (var e2, o, t = 0, f2 = "", n = arguments.length; t < n; t++) (e2 = arguments[t]) && (o = r(e2)) && (f2 && (f2 += " "), f2 += o);
+  return f2;
+}
+clsx.exports = e, clsx.exports.clsx = e;
+var clsxExports = clsx.exports;
+var domFns = {};
+var shims = {};
+Object.defineProperty(shims, "__esModule", {
+  value: true
+});
+shims.dontSetMe = dontSetMe;
+shims.findInArray = findInArray;
+shims.int = int;
+shims.isFunction = isFunction;
+shims.isNum = isNum;
+function findInArray(array, callback) {
+  for (let i = 0, length = array.length; i < length; i++) {
+    if (callback.apply(callback, [array[i], i, array])) return array[i];
+  }
+}
+function isFunction(func) {
+  return typeof func === "function" || Object.prototype.toString.call(func) === "[object Function]";
+}
+function isNum(num) {
+  return typeof num === "number" && !isNaN(num);
+}
+function int(a) {
+  return parseInt(a, 10);
+}
+function dontSetMe(props, propName, componentName) {
+  if (props[propName]) {
+    return new Error(`Invalid prop ${propName} passed to ${componentName} - do not set this, set it on the child.`);
+  }
+}
+var getPrefix$1 = {};
+Object.defineProperty(getPrefix$1, "__esModule", {
+  value: true
+});
+getPrefix$1.browserPrefixToKey = browserPrefixToKey;
+getPrefix$1.browserPrefixToStyle = browserPrefixToStyle;
+getPrefix$1.default = void 0;
+getPrefix$1.getPrefix = getPrefix;
+const prefixes = ["Moz", "Webkit", "O", "ms"];
+function getPrefix() {
+  var _a, _b;
+  let prop = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "transform";
+  if (typeof window === "undefined") return "";
+  const style = (_b = (_a = window.document) == null ? void 0 : _a.documentElement) == null ? void 0 : _b.style;
+  if (!style) return "";
+  if (prop in style) return "";
+  for (let i = 0; i < prefixes.length; i++) {
+    if (browserPrefixToKey(prop, prefixes[i]) in style) return prefixes[i];
+  }
+  return "";
+}
+function browserPrefixToKey(prop, prefix) {
+  return prefix ? `${prefix}${kebabToTitleCase(prop)}` : prop;
+}
+function browserPrefixToStyle(prop, prefix) {
+  return prefix ? `-${prefix.toLowerCase()}-${prop}` : prop;
+}
+function kebabToTitleCase(str) {
+  let out = "";
+  let shouldCapitalize = true;
+  for (let i = 0; i < str.length; i++) {
+    if (shouldCapitalize) {
+      out += str[i].toUpperCase();
+      shouldCapitalize = false;
+    } else if (str[i] === "-") {
+      shouldCapitalize = true;
+    } else {
+      out += str[i];
+    }
+  }
+  return out;
+}
+getPrefix$1.default = getPrefix();
+Object.defineProperty(domFns, "__esModule", {
+  value: true
+});
+domFns.addClassName = addClassName;
+domFns.addEvent = addEvent;
+domFns.addUserSelectStyles = addUserSelectStyles;
+domFns.createCSSTransform = createCSSTransform;
+domFns.createSVGTransform = createSVGTransform;
+domFns.getTouch = getTouch;
+domFns.getTouchIdentifier = getTouchIdentifier;
+domFns.getTranslation = getTranslation;
+domFns.innerHeight = innerHeight;
+domFns.innerWidth = innerWidth;
+domFns.matchesSelector = matchesSelector;
+domFns.matchesSelectorAndParentsTo = matchesSelectorAndParentsTo;
+domFns.offsetXYFromParent = offsetXYFromParent;
+domFns.outerHeight = outerHeight;
+domFns.outerWidth = outerWidth;
+domFns.removeClassName = removeClassName;
+domFns.removeEvent = removeEvent;
+domFns.scheduleRemoveUserSelectStyles = scheduleRemoveUserSelectStyles;
+var _shims$2 = shims;
+var _getPrefix = _interopRequireWildcard$1(getPrefix$1);
+function _interopRequireWildcard$1(e2, t) {
+  if ("function" == typeof WeakMap) var r2 = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap();
+  return (_interopRequireWildcard$1 = function(e3, t2) {
+    if (!t2 && e3 && e3.__esModule) return e3;
+    var o, i, f2 = { __proto__: null, default: e3 };
+    if (null === e3 || "object" != typeof e3 && "function" != typeof e3) return f2;
+    if (o = t2 ? n : r2) {
+      if (o.has(e3)) return o.get(e3);
+      o.set(e3, f2);
+    }
+    for (const t3 in e3) "default" !== t3 && {}.hasOwnProperty.call(e3, t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e3, t3)) && (i.get || i.set) ? o(f2, t3, i) : f2[t3] = e3[t3]);
+    return f2;
+  })(e2, t);
+}
+let matchesSelectorFunc = "";
+function matchesSelector(el, selector) {
+  if (!matchesSelectorFunc) {
+    matchesSelectorFunc = (0, _shims$2.findInArray)(["matches", "webkitMatchesSelector", "mozMatchesSelector", "msMatchesSelector", "oMatchesSelector"], function(method) {
+      return (0, _shims$2.isFunction)(el[method]);
+    });
+  }
+  if (!(0, _shims$2.isFunction)(el[matchesSelectorFunc])) return false;
+  return el[matchesSelectorFunc](selector);
+}
+function matchesSelectorAndParentsTo(el, selector, baseNode) {
+  let node = el;
+  do {
+    if (matchesSelector(node, selector)) return true;
+    if (node === baseNode) return false;
+    node = node.parentNode;
+  } while (node);
+  return false;
+}
+function addEvent(el, event, handler, inputOptions) {
+  if (!el) return;
+  const options2 = {
+    capture: true,
+    ...inputOptions
+  };
+  if (el.addEventListener) {
+    el.addEventListener(event, handler, options2);
+  } else if (el.attachEvent) {
+    el.attachEvent("on" + event, handler);
+  } else {
+    el["on" + event] = handler;
+  }
+}
+function removeEvent(el, event, handler, inputOptions) {
+  if (!el) return;
+  const options2 = {
+    capture: true,
+    ...inputOptions
+  };
+  if (el.removeEventListener) {
+    el.removeEventListener(event, handler, options2);
+  } else if (el.detachEvent) {
+    el.detachEvent("on" + event, handler);
+  } else {
+    el["on" + event] = null;
+  }
+}
+function outerHeight(node) {
+  let height = node.clientHeight;
+  const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
+  height += (0, _shims$2.int)(computedStyle.borderTopWidth);
+  height += (0, _shims$2.int)(computedStyle.borderBottomWidth);
+  return height;
+}
+function outerWidth(node) {
+  let width = node.clientWidth;
+  const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
+  width += (0, _shims$2.int)(computedStyle.borderLeftWidth);
+  width += (0, _shims$2.int)(computedStyle.borderRightWidth);
+  return width;
+}
+function innerHeight(node) {
+  let height = node.clientHeight;
+  const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
+  height -= (0, _shims$2.int)(computedStyle.paddingTop);
+  height -= (0, _shims$2.int)(computedStyle.paddingBottom);
+  return height;
+}
+function innerWidth(node) {
+  let width = node.clientWidth;
+  const computedStyle = node.ownerDocument.defaultView.getComputedStyle(node);
+  width -= (0, _shims$2.int)(computedStyle.paddingLeft);
+  width -= (0, _shims$2.int)(computedStyle.paddingRight);
+  return width;
+}
+function offsetXYFromParent(evt, offsetParent, scale) {
+  const isBody = offsetParent === offsetParent.ownerDocument.body;
+  const offsetParentRect = isBody ? {
+    left: 0,
+    top: 0
+  } : offsetParent.getBoundingClientRect();
+  const x2 = (evt.clientX + offsetParent.scrollLeft - offsetParentRect.left) / scale;
+  const y = (evt.clientY + offsetParent.scrollTop - offsetParentRect.top) / scale;
+  return {
+    x: x2,
+    y
+  };
+}
+function createCSSTransform(controlPos, positionOffset) {
+  const translation = getTranslation(controlPos, positionOffset, "px");
+  return {
+    [(0, _getPrefix.browserPrefixToKey)("transform", _getPrefix.default)]: translation
+  };
+}
+function createSVGTransform(controlPos, positionOffset) {
+  const translation = getTranslation(controlPos, positionOffset, "");
+  return translation;
+}
+function getTranslation(_ref, positionOffset, unitSuffix) {
+  let {
+    x: x2,
+    y
+  } = _ref;
+  let translation = `translate(${x2}${unitSuffix},${y}${unitSuffix})`;
+  if (positionOffset) {
+    const defaultX = `${typeof positionOffset.x === "string" ? positionOffset.x : positionOffset.x + unitSuffix}`;
+    const defaultY = `${typeof positionOffset.y === "string" ? positionOffset.y : positionOffset.y + unitSuffix}`;
+    translation = `translate(${defaultX}, ${defaultY})` + translation;
+  }
+  return translation;
+}
+function getTouch(e2, identifier) {
+  return e2.targetTouches && (0, _shims$2.findInArray)(e2.targetTouches, (t) => identifier === t.identifier) || e2.changedTouches && (0, _shims$2.findInArray)(e2.changedTouches, (t) => identifier === t.identifier);
+}
+function getTouchIdentifier(e2) {
+  if (e2.targetTouches && e2.targetTouches[0]) return e2.targetTouches[0].identifier;
+  if (e2.changedTouches && e2.changedTouches[0]) return e2.changedTouches[0].identifier;
+}
+function addUserSelectStyles(doc) {
+  if (!doc) return;
+  let styleEl = doc.getElementById("react-draggable-style-el");
+  if (!styleEl) {
+    styleEl = doc.createElement("style");
+    styleEl.type = "text/css";
+    styleEl.id = "react-draggable-style-el";
+    styleEl.innerHTML = ".react-draggable-transparent-selection *::-moz-selection {all: inherit;}\n";
+    styleEl.innerHTML += ".react-draggable-transparent-selection *::selection {all: inherit;}\n";
+    doc.getElementsByTagName("head")[0].appendChild(styleEl);
+  }
+  if (doc.body) addClassName(doc.body, "react-draggable-transparent-selection");
+}
+function scheduleRemoveUserSelectStyles(doc) {
+  if (window.requestAnimationFrame) {
+    window.requestAnimationFrame(() => {
+      removeUserSelectStyles(doc);
+    });
+  } else {
+    removeUserSelectStyles(doc);
+  }
+}
+function removeUserSelectStyles(doc) {
+  if (!doc) return;
+  try {
+    if (doc.body) removeClassName(doc.body, "react-draggable-transparent-selection");
+    if (doc.selection) {
+      doc.selection.empty();
+    } else {
+      const selection = (doc.defaultView || window).getSelection();
+      if (selection && selection.type !== "Caret") {
+        selection.removeAllRanges();
+      }
+    }
+  } catch (e2) {
+  }
+}
+function addClassName(el, className) {
+  if (el.classList) {
+    el.classList.add(className);
+  } else {
+    if (!el.className.match(new RegExp(`(?:^|\\s)${className}(?!\\S)`))) {
+      el.className += ` ${className}`;
+    }
+  }
+}
+function removeClassName(el, className) {
+  if (el.classList) {
+    el.classList.remove(className);
+  } else {
+    el.className = el.className.replace(new RegExp(`(?:^|\\s)${className}(?!\\S)`, "g"), "");
+  }
+}
+var positionFns = {};
+Object.defineProperty(positionFns, "__esModule", {
+  value: true
+});
+positionFns.canDragX = canDragX;
+positionFns.canDragY = canDragY;
+positionFns.createCoreData = createCoreData;
+positionFns.createDraggableData = createDraggableData;
+positionFns.getBoundPosition = getBoundPosition;
+positionFns.getControlPosition = getControlPosition;
+positionFns.snapToGrid = snapToGrid;
+var _shims$1 = shims;
+var _domFns$1 = domFns;
+function getBoundPosition(draggable, x2, y) {
+  if (!draggable.props.bounds) return [x2, y];
+  let {
+    bounds
+  } = draggable.props;
+  bounds = typeof bounds === "string" ? bounds : cloneBounds(bounds);
+  const node = findDOMNode(draggable);
+  if (typeof bounds === "string") {
+    const {
+      ownerDocument
+    } = node;
+    const ownerWindow = ownerDocument.defaultView;
+    let boundNode;
+    if (bounds === "parent") {
+      boundNode = node.parentNode;
+    } else {
+      const rootNode = node.getRootNode();
+      boundNode = rootNode.querySelector(bounds);
+    }
+    if (!(boundNode instanceof ownerWindow.HTMLElement)) {
+      throw new Error('Bounds selector "' + bounds + '" could not find an element.');
+    }
+    const boundNodeEl = boundNode;
+    const nodeStyle = ownerWindow.getComputedStyle(node);
+    const boundNodeStyle = ownerWindow.getComputedStyle(boundNodeEl);
+    bounds = {
+      left: -node.offsetLeft + (0, _shims$1.int)(boundNodeStyle.paddingLeft) + (0, _shims$1.int)(nodeStyle.marginLeft),
+      top: -node.offsetTop + (0, _shims$1.int)(boundNodeStyle.paddingTop) + (0, _shims$1.int)(nodeStyle.marginTop),
+      right: (0, _domFns$1.innerWidth)(boundNodeEl) - (0, _domFns$1.outerWidth)(node) - node.offsetLeft + (0, _shims$1.int)(boundNodeStyle.paddingRight) - (0, _shims$1.int)(nodeStyle.marginRight),
+      bottom: (0, _domFns$1.innerHeight)(boundNodeEl) - (0, _domFns$1.outerHeight)(node) - node.offsetTop + (0, _shims$1.int)(boundNodeStyle.paddingBottom) - (0, _shims$1.int)(nodeStyle.marginBottom)
+    };
+  }
+  if ((0, _shims$1.isNum)(bounds.right)) x2 = Math.min(x2, bounds.right);
+  if ((0, _shims$1.isNum)(bounds.bottom)) y = Math.min(y, bounds.bottom);
+  if ((0, _shims$1.isNum)(bounds.left)) x2 = Math.max(x2, bounds.left);
+  if ((0, _shims$1.isNum)(bounds.top)) y = Math.max(y, bounds.top);
+  return [x2, y];
+}
+function snapToGrid(grid, pendingX, pendingY) {
+  const x2 = Math.round(pendingX / grid[0]) * grid[0];
+  const y = Math.round(pendingY / grid[1]) * grid[1];
+  return [x2, y];
+}
+function canDragX(draggable) {
+  return draggable.props.axis === "both" || draggable.props.axis === "x";
+}
+function canDragY(draggable) {
+  return draggable.props.axis === "both" || draggable.props.axis === "y";
+}
+function getControlPosition(e2, touchIdentifier, draggableCore) {
+  const touchObj = typeof touchIdentifier === "number" ? (0, _domFns$1.getTouch)(e2, touchIdentifier) : null;
+  if (typeof touchIdentifier === "number" && !touchObj) return null;
+  const node = findDOMNode(draggableCore);
+  const offsetParent = draggableCore.props.offsetParent || node.offsetParent || node.ownerDocument.body;
+  return (0, _domFns$1.offsetXYFromParent)(touchObj || e2, offsetParent, draggableCore.props.scale);
+}
+function createCoreData(draggable, x2, y) {
+  const isStart = !(0, _shims$1.isNum)(draggable.lastX);
+  const node = findDOMNode(draggable);
+  if (isStart) {
+    return {
+      node,
+      deltaX: 0,
+      deltaY: 0,
+      lastX: x2,
+      lastY: y,
+      x: x2,
+      y
+    };
+  } else {
+    return {
+      node,
+      deltaX: x2 - draggable.lastX,
+      deltaY: y - draggable.lastY,
+      lastX: draggable.lastX,
+      lastY: draggable.lastY,
+      x: x2,
+      y
+    };
+  }
+}
+function createDraggableData(draggable, coreData) {
+  const scale = draggable.props.scale;
+  return {
+    node: coreData.node,
+    x: draggable.state.x + coreData.deltaX / scale,
+    y: draggable.state.y + coreData.deltaY / scale,
+    deltaX: coreData.deltaX / scale,
+    deltaY: coreData.deltaY / scale,
+    lastX: draggable.state.x,
+    lastY: draggable.state.y
+  };
+}
+function cloneBounds(bounds) {
+  return {
+    left: bounds.left,
+    top: bounds.top,
+    right: bounds.right,
+    bottom: bounds.bottom
+  };
+}
+function findDOMNode(draggable) {
+  const node = draggable.findDOMNode();
+  if (!node) {
+    throw new Error("<DraggableCore>: Unmounted during event!");
+  }
+  return node;
+}
+var DraggableCore$2 = {};
+var log$1 = {};
+Object.defineProperty(log$1, "__esModule", {
+  value: true
+});
+log$1.default = log;
+function log() {
+}
+Object.defineProperty(DraggableCore$2, "__esModule", {
+  value: true
+});
+DraggableCore$2.default = void 0;
+var React = _interopRequireWildcard(require$$2);
+var _propTypes = _interopRequireDefault(propTypesExports);
+var _reactDom = _interopRequireDefault(require$$2);
+var _domFns = domFns;
+var _positionFns = positionFns;
+var _shims = shims;
+var _log = _interopRequireDefault(log$1);
+function _interopRequireDefault(e2) {
+  return e2 && e2.__esModule ? e2 : { default: e2 };
+}
+function _interopRequireWildcard(e2, t) {
+  if ("function" == typeof WeakMap) var r2 = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap();
+  return (_interopRequireWildcard = function(e3, t2) {
+    if (!t2 && e3 && e3.__esModule) return e3;
+    var o, i, f2 = { __proto__: null, default: e3 };
+    if (null === e3 || "object" != typeof e3 && "function" != typeof e3) return f2;
+    if (o = t2 ? n : r2) {
+      if (o.has(e3)) return o.get(e3);
+      o.set(e3, f2);
+    }
+    for (const t3 in e3) "default" !== t3 && {}.hasOwnProperty.call(e3, t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e3, t3)) && (i.get || i.set) ? o(f2, t3, i) : f2[t3] = e3[t3]);
+    return f2;
+  })(e2, t);
+}
+function _defineProperty(e2, r2, t) {
+  return (r2 = _toPropertyKey(r2)) in e2 ? Object.defineProperty(e2, r2, { value: t, enumerable: true, configurable: true, writable: true }) : e2[r2] = t, e2;
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : i + "";
+}
+function _toPrimitive(t, r2) {
+  if ("object" != typeof t || !t) return t;
+  var e2 = t[Symbol.toPrimitive];
+  if (void 0 !== e2) {
+    var i = e2.call(t, r2);
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r2 ? String : Number)(t);
+}
+const eventsFor = {
+  touch: {
+    start: "touchstart",
+    move: "touchmove",
+    stop: "touchend"
+  },
+  mouse: {
+    start: "mousedown",
+    move: "mousemove",
+    stop: "mouseup"
+  }
+};
+let dragEventFor = eventsFor.mouse;
+let DraggableCore$1 = class DraggableCore extends React.Component {
+  constructor() {
+    super(...arguments);
+    _defineProperty(this, "dragging", false);
+    _defineProperty(this, "lastX", NaN);
+    _defineProperty(this, "lastY", NaN);
+    _defineProperty(this, "touchIdentifier", null);
+    _defineProperty(this, "mounted", false);
+    _defineProperty(this, "handleDragStart", (e2) => {
+      this.props.onMouseDown(e2);
+      if (!this.props.allowAnyClick && typeof e2.button === "number" && e2.button !== 0) return false;
+      const thisNode = this.findDOMNode();
+      if (!thisNode || !thisNode.ownerDocument || !thisNode.ownerDocument.body) {
+        throw new Error("<DraggableCore> not mounted on DragStart!");
+      }
+      const {
+        ownerDocument
+      } = thisNode;
+      if (this.props.disabled || !(e2.target instanceof ownerDocument.defaultView.Node) || this.props.handle && !(0, _domFns.matchesSelectorAndParentsTo)(e2.target, this.props.handle, thisNode) || this.props.cancel && (0, _domFns.matchesSelectorAndParentsTo)(e2.target, this.props.cancel, thisNode)) {
+        return;
+      }
+      if (e2.type === "touchstart" && !this.props.allowMobileScroll) e2.preventDefault();
+      const touchIdentifier = (0, _domFns.getTouchIdentifier)(e2);
+      this.touchIdentifier = touchIdentifier;
+      const position = (0, _positionFns.getControlPosition)(e2, touchIdentifier, this);
+      if (position == null) return;
+      const {
+        x: x2,
+        y
+      } = position;
+      const coreEvent = (0, _positionFns.createCoreData)(this, x2, y);
+      (0, _log.default)("DraggableCore: handleDragStart: %j", coreEvent);
+      (0, _log.default)("calling", this.props.onStart);
+      const shouldUpdate = this.props.onStart(e2, coreEvent);
+      if (shouldUpdate === false || this.mounted === false) return;
+      if (this.props.enableUserSelectHack) (0, _domFns.addUserSelectStyles)(ownerDocument);
+      this.dragging = true;
+      this.lastX = x2;
+      this.lastY = y;
+      (0, _domFns.addEvent)(ownerDocument, dragEventFor.move, this.handleDrag);
+      (0, _domFns.addEvent)(ownerDocument, dragEventFor.stop, this.handleDragStop);
+    });
+    _defineProperty(this, "handleDrag", (e2) => {
+      const position = (0, _positionFns.getControlPosition)(e2, this.touchIdentifier, this);
+      if (position == null) return;
+      let {
+        x: x2,
+        y
+      } = position;
+      if (Array.isArray(this.props.grid)) {
+        let deltaX = x2 - this.lastX, deltaY = y - this.lastY;
+        [deltaX, deltaY] = (0, _positionFns.snapToGrid)(this.props.grid, deltaX, deltaY);
+        if (!deltaX && !deltaY) return;
+        x2 = this.lastX + deltaX, y = this.lastY + deltaY;
+      }
+      const coreEvent = (0, _positionFns.createCoreData)(this, x2, y);
+      (0, _log.default)("DraggableCore: handleDrag: %j", coreEvent);
+      const shouldUpdate = this.props.onDrag(e2, coreEvent);
+      if (shouldUpdate === false || this.mounted === false) {
+        try {
+          this.handleDragStop(new MouseEvent("mouseup"));
+        } catch (err) {
+          const event = document.createEvent("MouseEvents");
+          event.initMouseEvent("mouseup", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
+          this.handleDragStop(event);
+        }
+        return;
+      }
+      this.lastX = x2;
+      this.lastY = y;
+    });
+    _defineProperty(this, "handleDragStop", (e2) => {
+      if (!this.dragging) return;
+      const position = (0, _positionFns.getControlPosition)(e2, this.touchIdentifier, this);
+      if (position == null) return;
+      let {
+        x: x2,
+        y
+      } = position;
+      if (Array.isArray(this.props.grid)) {
+        let deltaX = x2 - this.lastX || 0;
+        let deltaY = y - this.lastY || 0;
+        [deltaX, deltaY] = (0, _positionFns.snapToGrid)(this.props.grid, deltaX, deltaY);
+        x2 = this.lastX + deltaX, y = this.lastY + deltaY;
+      }
+      const coreEvent = (0, _positionFns.createCoreData)(this, x2, y);
+      const shouldContinue = this.props.onStop(e2, coreEvent);
+      if (shouldContinue === false || this.mounted === false) return false;
+      const thisNode = this.findDOMNode();
+      if (thisNode) {
+        if (this.props.enableUserSelectHack) (0, _domFns.scheduleRemoveUserSelectStyles)(thisNode.ownerDocument);
+      }
+      (0, _log.default)("DraggableCore: handleDragStop: %j", coreEvent);
+      this.dragging = false;
+      this.lastX = NaN;
+      this.lastY = NaN;
+      if (thisNode) {
+        (0, _log.default)("DraggableCore: Removing handlers");
+        (0, _domFns.removeEvent)(thisNode.ownerDocument, dragEventFor.move, this.handleDrag);
+        (0, _domFns.removeEvent)(thisNode.ownerDocument, dragEventFor.stop, this.handleDragStop);
+      }
+    });
+    _defineProperty(this, "onMouseDown", (e2) => {
+      dragEventFor = eventsFor.mouse;
+      return this.handleDragStart(e2);
+    });
+    _defineProperty(this, "onMouseUp", (e2) => {
+      dragEventFor = eventsFor.mouse;
+      return this.handleDragStop(e2);
+    });
+    _defineProperty(this, "onTouchStart", (e2) => {
+      dragEventFor = eventsFor.touch;
+      return this.handleDragStart(e2);
+    });
+    _defineProperty(this, "onTouchEnd", (e2) => {
+      dragEventFor = eventsFor.touch;
+      return this.handleDragStop(e2);
+    });
+  }
+  componentDidMount() {
+    this.mounted = true;
+    const thisNode = this.findDOMNode();
+    if (thisNode) {
+      (0, _domFns.addEvent)(thisNode, eventsFor.touch.start, this.onTouchStart, {
+        passive: false
+      });
+    }
+  }
+  componentWillUnmount() {
+    this.mounted = false;
+    const thisNode = this.findDOMNode();
+    if (thisNode) {
+      const {
+        ownerDocument
+      } = thisNode;
+      (0, _domFns.removeEvent)(ownerDocument, eventsFor.mouse.move, this.handleDrag);
+      (0, _domFns.removeEvent)(ownerDocument, eventsFor.touch.move, this.handleDrag);
+      (0, _domFns.removeEvent)(ownerDocument, eventsFor.mouse.stop, this.handleDragStop);
+      (0, _domFns.removeEvent)(ownerDocument, eventsFor.touch.stop, this.handleDragStop);
+      (0, _domFns.removeEvent)(thisNode, eventsFor.touch.start, this.onTouchStart, {
+        passive: false
+      });
+      if (this.props.enableUserSelectHack) (0, _domFns.scheduleRemoveUserSelectStyles)(ownerDocument);
+    }
+  }
+  // React Strict Mode compatibility: if `nodeRef` is passed, we will use it instead of trying to find
+  // the underlying DOM node ourselves. See the README for more information.
+  findDOMNode() {
+    var _a, _b, _c;
+    return ((_a = this.props) == null ? void 0 : _a.nodeRef) ? (_c = (_b = this.props) == null ? void 0 : _b.nodeRef) == null ? void 0 : _c.current : _reactDom.default.findDOMNode(this);
+  }
+  render() {
+    return /* @__PURE__ */ React.cloneElement(React.Children.only(this.props.children), {
+      // Note: mouseMove handler is attached to document so it will still function
+      // when the user drags quickly and leaves the bounds of the element.
+      onMouseDown: this.onMouseDown,
+      onMouseUp: this.onMouseUp,
+      // onTouchStart is added on `componentDidMount` so they can be added with
+      // {passive: false}, which allows it to cancel. See
+      // https://developers.google.com/web/updates/2017/01/scrolling-intervention
+      onTouchEnd: this.onTouchEnd
+    });
+  }
+};
+DraggableCore$2.default = DraggableCore$1;
+_defineProperty(DraggableCore$1, "displayName", "DraggableCore");
+_defineProperty(DraggableCore$1, "propTypes", {
+  /**
+   * `allowAnyClick` allows dragging using any mouse button.
+   * By default, we only accept the left button.
+   *
+   * Defaults to `false`.
+   */
+  allowAnyClick: _propTypes.default.bool,
+  /**
+   * `allowMobileScroll` turns off cancellation of the 'touchstart' event
+   * on mobile devices. Only enable this if you are having trouble with click
+   * events. Prefer using 'handle' / 'cancel' instead.
+   *
+   * Defaults to `false`.
+   */
+  allowMobileScroll: _propTypes.default.bool,
+  children: _propTypes.default.node.isRequired,
+  /**
+   * `disabled`, if true, stops the <Draggable> from dragging. All handlers,
+   * with the exception of `onMouseDown`, will not fire.
+   */
+  disabled: _propTypes.default.bool,
+  /**
+   * By default, we add 'user-select:none' attributes to the document body
+   * to prevent ugly text selection during drag. If this is causing problems
+   * for your app, set this to `false`.
+   */
+  enableUserSelectHack: _propTypes.default.bool,
+  /**
+   * `offsetParent`, if set, uses the passed DOM node to compute drag offsets
+   * instead of using the parent node.
+   */
+  offsetParent: function(props, propName) {
+    if (props[propName] && props[propName].nodeType !== 1) {
+      throw new Error("Draggable's offsetParent must be a DOM Node.");
+    }
+  },
+  /**
+   * `grid` specifies the x and y that dragging should snap to.
+   */
+  grid: _propTypes.default.arrayOf(_propTypes.default.number),
+  /**
+   * `handle` specifies a selector to be used as the handle that initiates drag.
+   *
+   * Example:
+   *
+   * ```jsx
+   *   let App = React.createClass({
+   *       render: function () {
+   *         return (
+   *            <Draggable handle=".handle">
+   *              <div>
+   *                  <div className="handle">Click me to drag</div>
+   *                  <div>This is some other content</div>
+   *              </div>
+   *           </Draggable>
+   *         );
+   *       }
+   *   });
+   * ```
+   */
+  handle: _propTypes.default.string,
+  /**
+   * `cancel` specifies a selector to be used to prevent drag initialization.
+   *
+   * Example:
+   *
+   * ```jsx
+   *   let App = React.createClass({
+   *       render: function () {
+   *           return(
+   *               <Draggable cancel=".cancel">
+   *                   <div>
+   *                     <div className="cancel">You can't drag from here</div>
+   *                     <div>Dragging here works fine</div>
+   *                   </div>
+   *               </Draggable>
+   *           );
+   *       }
+   *   });
+   * ```
+   */
+  cancel: _propTypes.default.string,
+  /* If running in React Strict mode, ReactDOM.findDOMNode() is deprecated.
+   * Unfortunately, in order for <Draggable> to work properly, we need raw access
+   * to the underlying DOM node. If you want to avoid the warning, pass a `nodeRef`
+   * as in this example:
+   *
+   * function MyComponent() {
+   *   const nodeRef = React.useRef(null);
+   *   return (
+   *     <Draggable nodeRef={nodeRef}>
+   *       <div ref={nodeRef}>Example Target</div>
+   *     </Draggable>
+   *   );
+   * }
+   *
+   * This can be used for arbitrarily nested components, so long as the ref ends up
+   * pointing to the actual child DOM node and not a custom component.
+   */
+  nodeRef: _propTypes.default.object,
+  /**
+   * Called when dragging starts.
+   * If this function returns the boolean false, dragging will be canceled.
+   */
+  onStart: _propTypes.default.func,
+  /**
+   * Called while dragging.
+   * If this function returns the boolean false, dragging will be canceled.
+   */
+  onDrag: _propTypes.default.func,
+  /**
+   * Called when dragging stops.
+   * If this function returns the boolean false, the drag will remain active.
+   */
+  onStop: _propTypes.default.func,
+  /**
+   * A workaround option which can be passed if onMouseDown needs to be accessed,
+   * since it'll always be blocked (as there is internal use of onMouseDown)
+   */
+  onMouseDown: _propTypes.default.func,
+  /**
+   * `scale`, if set, applies scaling while dragging an element
+   */
+  scale: _propTypes.default.number,
+  /**
+   * These properties should be defined on the child, not here.
+   */
+  className: _shims.dontSetMe,
+  style: _shims.dontSetMe,
+  transform: _shims.dontSetMe
+});
+_defineProperty(DraggableCore$1, "defaultProps", {
+  allowAnyClick: false,
+  // by default only accept left click
+  allowMobileScroll: false,
+  disabled: false,
+  enableUserSelectHack: true,
+  onStart: function() {
+  },
+  onDrag: function() {
+  },
+  onStop: function() {
+  },
+  onMouseDown: function() {
+  },
+  scale: 1
+});
+(function(exports) {
+  Object.defineProperty(exports, "__esModule", {
+    value: true
+  });
+  Object.defineProperty(exports, "DraggableCore", {
+    enumerable: true,
+    get: function() {
+      return _DraggableCore.default;
+    }
+  });
+  exports.default = void 0;
+  var React2 = _interopRequireWildcard2(require$$2);
+  var _propTypes2 = _interopRequireDefault2(propTypesExports);
+  var _reactDom2 = _interopRequireDefault2(require$$2);
+  var _clsx = clsxExports;
+  var _domFns2 = domFns;
+  var _positionFns2 = positionFns;
+  var _shims2 = shims;
+  var _DraggableCore = _interopRequireDefault2(DraggableCore$2);
+  var _log2 = _interopRequireDefault2(log$1);
+  function _interopRequireDefault2(e2) {
+    return e2 && e2.__esModule ? e2 : { default: e2 };
+  }
+  function _interopRequireWildcard2(e2, t) {
+    if ("function" == typeof WeakMap) var r2 = /* @__PURE__ */ new WeakMap(), n = /* @__PURE__ */ new WeakMap();
+    return (_interopRequireWildcard2 = function(e3, t2) {
+      if (!t2 && e3 && e3.__esModule) return e3;
+      var o, i, f2 = { __proto__: null, default: e3 };
+      if (null === e3 || "object" != typeof e3 && "function" != typeof e3) return f2;
+      if (o = t2 ? n : r2) {
+        if (o.has(e3)) return o.get(e3);
+        o.set(e3, f2);
+      }
+      for (const t3 in e3) "default" !== t3 && {}.hasOwnProperty.call(e3, t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e3, t3)) && (i.get || i.set) ? o(f2, t3, i) : f2[t3] = e3[t3]);
+      return f2;
+    })(e2, t);
+  }
+  function _extends() {
+    return _extends = Object.assign ? Object.assign.bind() : function(n) {
+      for (var e2 = 1; e2 < arguments.length; e2++) {
+        var t = arguments[e2];
+        for (var r2 in t) ({}).hasOwnProperty.call(t, r2) && (n[r2] = t[r2]);
+      }
+      return n;
+    }, _extends.apply(null, arguments);
+  }
+  function _defineProperty2(e2, r2, t) {
+    return (r2 = _toPropertyKey2(r2)) in e2 ? Object.defineProperty(e2, r2, { value: t, enumerable: true, configurable: true, writable: true }) : e2[r2] = t, e2;
+  }
+  function _toPropertyKey2(t) {
+    var i = _toPrimitive2(t, "string");
+    return "symbol" == typeof i ? i : i + "";
+  }
+  function _toPrimitive2(t, r2) {
+    if ("object" != typeof t || !t) return t;
+    var e2 = t[Symbol.toPrimitive];
+    if (void 0 !== e2) {
+      var i = e2.call(t, r2);
+      if ("object" != typeof i) return i;
+      throw new TypeError("@@toPrimitive must return a primitive value.");
+    }
+    return ("string" === r2 ? String : Number)(t);
+  }
+  class Draggable2 extends React2.Component {
+    // React 16.3+
+    // Arity (props, state)
+    static getDerivedStateFromProps(_ref, _ref2) {
+      let {
+        position
+      } = _ref;
+      let {
+        prevPropsPosition
+      } = _ref2;
+      if (position && (!prevPropsPosition || position.x !== prevPropsPosition.x || position.y !== prevPropsPosition.y)) {
+        (0, _log2.default)("Draggable: getDerivedStateFromProps %j", {
+          position,
+          prevPropsPosition
+        });
+        return {
+          x: position.x,
+          y: position.y,
+          prevPropsPosition: {
+            ...position
+          }
+        };
+      }
+      return null;
+    }
+    constructor(props) {
+      super(props);
+      _defineProperty2(this, "onDragStart", (e2, coreData) => {
+        (0, _log2.default)("Draggable: onDragStart: %j", coreData);
+        const shouldStart = this.props.onStart(e2, (0, _positionFns2.createDraggableData)(this, coreData));
+        if (shouldStart === false) return false;
+        this.setState({
+          dragging: true,
+          dragged: true
+        });
+      });
+      _defineProperty2(this, "onDrag", (e2, coreData) => {
+        if (!this.state.dragging) return false;
+        (0, _log2.default)("Draggable: onDrag: %j", coreData);
+        const uiData = (0, _positionFns2.createDraggableData)(this, coreData);
+        const newState = {
+          x: uiData.x,
+          y: uiData.y,
+          slackX: 0,
+          slackY: 0
+        };
+        if (this.props.bounds) {
+          const {
+            x: x2,
+            y
+          } = newState;
+          newState.x += this.state.slackX;
+          newState.y += this.state.slackY;
+          const [newStateX, newStateY] = (0, _positionFns2.getBoundPosition)(this, newState.x, newState.y);
+          newState.x = newStateX;
+          newState.y = newStateY;
+          newState.slackX = this.state.slackX + (x2 - newState.x);
+          newState.slackY = this.state.slackY + (y - newState.y);
+          uiData.x = newState.x;
+          uiData.y = newState.y;
+          uiData.deltaX = newState.x - this.state.x;
+          uiData.deltaY = newState.y - this.state.y;
+        }
+        const shouldUpdate = this.props.onDrag(e2, uiData);
+        if (shouldUpdate === false) return false;
+        this.setState(newState);
+      });
+      _defineProperty2(this, "onDragStop", (e2, coreData) => {
+        if (!this.state.dragging) return false;
+        const shouldContinue = this.props.onStop(e2, (0, _positionFns2.createDraggableData)(this, coreData));
+        if (shouldContinue === false) return false;
+        (0, _log2.default)("Draggable: onDragStop: %j", coreData);
+        const newState = {
+          dragging: false,
+          slackX: 0,
+          slackY: 0
+        };
+        const controlled = Boolean(this.props.position);
+        if (controlled) {
+          const {
+            x: x2,
+            y
+          } = this.props.position;
+          newState.x = x2;
+          newState.y = y;
+        }
+        this.setState(newState);
+      });
+      this.state = {
+        // Whether or not we are currently dragging.
+        dragging: false,
+        // Whether or not we have been dragged before.
+        dragged: false,
+        // Current transform x and y.
+        x: props.position ? props.position.x : props.defaultPosition.x,
+        y: props.position ? props.position.y : props.defaultPosition.y,
+        prevPropsPosition: {
+          ...props.position
+        },
+        // Used for compensating for out-of-bounds drags
+        slackX: 0,
+        slackY: 0,
+        // Can only determine if SVG after mounting
+        isElementSVG: false
+      };
+      if (props.position && !(props.onDrag || props.onStop)) {
+        console.warn("A `position` was applied to this <Draggable>, without drag handlers. This will make this component effectively undraggable. Please attach `onDrag` or `onStop` handlers so you can adjust the `position` of this element.");
+      }
+    }
+    componentDidMount() {
+      if (typeof window.SVGElement !== "undefined" && this.findDOMNode() instanceof window.SVGElement) {
+        this.setState({
+          isElementSVG: true
+        });
+      }
+    }
+    componentWillUnmount() {
+      if (this.state.dragging) {
+        this.setState({
+          dragging: false
+        });
+      }
+    }
+    // React Strict Mode compatibility: if `nodeRef` is passed, we will use it instead of trying to find
+    // the underlying DOM node ourselves. See the README for more information.
+    findDOMNode() {
+      var _a, _b;
+      return ((_b = (_a = this.props) == null ? void 0 : _a.nodeRef) == null ? void 0 : _b.current) ?? _reactDom2.default.findDOMNode(this);
+    }
+    render() {
+      const {
+        axis,
+        bounds,
+        children,
+        defaultPosition,
+        defaultClassName,
+        defaultClassNameDragging,
+        defaultClassNameDragged,
+        position,
+        positionOffset,
+        scale,
+        ...draggableCoreProps
+      } = this.props;
+      let style = {};
+      let svgTransform = null;
+      const controlled = Boolean(position);
+      const draggable = !controlled || this.state.dragging;
+      const validPosition = position || defaultPosition;
+      const transformOpts = {
+        // Set left if horizontal drag is enabled
+        x: (0, _positionFns2.canDragX)(this) && draggable ? this.state.x : validPosition.x,
+        // Set top if vertical drag is enabled
+        y: (0, _positionFns2.canDragY)(this) && draggable ? this.state.y : validPosition.y
+      };
+      if (this.state.isElementSVG) {
+        svgTransform = (0, _domFns2.createSVGTransform)(transformOpts, positionOffset);
+      } else {
+        style = (0, _domFns2.createCSSTransform)(transformOpts, positionOffset);
+      }
+      const className = (0, _clsx.clsx)(children.props.className || "", defaultClassName, {
+        [defaultClassNameDragging]: this.state.dragging,
+        [defaultClassNameDragged]: this.state.dragged
+      });
+      return /* @__PURE__ */ React2.createElement(_DraggableCore.default, _extends({}, draggableCoreProps, {
+        onStart: this.onDragStart,
+        onDrag: this.onDrag,
+        onStop: this.onDragStop
+      }), /* @__PURE__ */ React2.cloneElement(React2.Children.only(children), {
+        className,
+        style: {
+          ...children.props.style,
+          ...style
+        },
+        transform: svgTransform
+      }));
+    }
+  }
+  exports.default = Draggable2;
+  _defineProperty2(Draggable2, "displayName", "Draggable");
+  _defineProperty2(Draggable2, "propTypes", {
+    // Accepts all props <DraggableCore> accepts.
+    ..._DraggableCore.default.propTypes,
+    /**
+     * `axis` determines which axis the draggable can move.
+     *
+     *  Note that all callbacks will still return data as normal. This only
+     *  controls flushing to the DOM.
+     *
+     * 'both' allows movement horizontally and vertically.
+     * 'x' limits movement to horizontal axis.
+     * 'y' limits movement to vertical axis.
+     * 'none' limits all movement.
+     *
+     * Defaults to 'both'.
+     */
+    axis: _propTypes2.default.oneOf(["both", "x", "y", "none"]),
+    /**
+     * `bounds` determines the range of movement available to the element.
+     * Available values are:
+     *
+     * 'parent' restricts movement within the Draggable's parent node.
+     *
+     * Alternatively, pass an object with the following properties, all of which are optional:
+     *
+     * {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}
+     *
+     * All values are in px.
+     *
+     * Example:
+     *
+     * ```jsx
+     *   let App = React.createClass({
+     *       render: function () {
+     *         return (
+     *            <Draggable bounds={{right: 300, bottom: 300}}>
+     *              <div>Content</div>
+     *           </Draggable>
+     *         );
+     *       }
+     *   });
+     * ```
+     */
+    bounds: _propTypes2.default.oneOfType([_propTypes2.default.shape({
+      left: _propTypes2.default.number,
+      right: _propTypes2.default.number,
+      top: _propTypes2.default.number,
+      bottom: _propTypes2.default.number
+    }), _propTypes2.default.string, _propTypes2.default.oneOf([false])]),
+    defaultClassName: _propTypes2.default.string,
+    defaultClassNameDragging: _propTypes2.default.string,
+    defaultClassNameDragged: _propTypes2.default.string,
+    /**
+     * `defaultPosition` specifies the x and y that the dragged item should start at
+     *
+     * Example:
+     *
+     * ```jsx
+     *      let App = React.createClass({
+     *          render: function () {
+     *              return (
+     *                  <Draggable defaultPosition={{x: 25, y: 25}}>
+     *                      <div>I start with transformX: 25px and transformY: 25px;</div>
+     *                  </Draggable>
+     *              );
+     *          }
+     *      });
+     * ```
+     */
+    defaultPosition: _propTypes2.default.shape({
+      x: _propTypes2.default.number,
+      y: _propTypes2.default.number
+    }),
+    positionOffset: _propTypes2.default.shape({
+      x: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string]),
+      y: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string])
+    }),
+    /**
+     * `position`, if present, defines the current position of the element.
+     *
+     *  This is similar to how form elements in React work - if no `position` is supplied, the component
+     *  is uncontrolled.
+     *
+     * Example:
+     *
+     * ```jsx
+     *      let App = React.createClass({
+     *          render: function () {
+     *              return (
+     *                  <Draggable position={{x: 25, y: 25}}>
+     *                      <div>I start with transformX: 25px and transformY: 25px;</div>
+     *                  </Draggable>
+     *              );
+     *          }
+     *      });
+     * ```
+     */
+    position: _propTypes2.default.shape({
+      x: _propTypes2.default.number,
+      y: _propTypes2.default.number
+    }),
+    /**
+     * These properties should be defined on the child, not here.
+     */
+    className: _shims2.dontSetMe,
+    style: _shims2.dontSetMe,
+    transform: _shims2.dontSetMe
+  });
+  _defineProperty2(Draggable2, "defaultProps", {
+    ..._DraggableCore.default.defaultProps,
+    axis: "both",
+    bounds: false,
+    defaultClassName: "react-draggable",
+    defaultClassNameDragging: "react-draggable-dragging",
+    defaultClassNameDragged: "react-draggable-dragged",
+    defaultPosition: {
+      x: 0,
+      y: 0
+    },
+    scale: 1
+  });
+})(Draggable$2);
+const {
+  default: Draggable,
+  DraggableCore: DraggableCore2
+} = Draggable$2;
+cjs.exports = Draggable;
+cjs.exports.default = Draggable;
+cjs.exports.DraggableCore = DraggableCore2;
+var cjsExports = cjs.exports;
+const Draggable$1 = /* @__PURE__ */ getDefaultExportFromCjs(cjsExports);
+function FloatingButton({ onClick, isActive, logCount = 0 }) {
+  const widgetWidth = 112;
+  const widgetHeight = 185;
+  const positionPresets = {
+    "top-left": { x: 20, y: 20 },
+    "top-center": { x: window.innerWidth / 2 - widgetWidth / 2, y: 20 },
+    "top-right": { x: window.innerWidth - widgetWidth - 20, y: 20 },
+    "middle-left": { x: 20, y: window.innerHeight / 2 - widgetHeight / 2 },
+    "middle-right": { x: window.innerWidth - widgetWidth - 20, y: window.innerHeight / 2 - widgetHeight / 2 },
+    "bottom-left": { x: 20, y: window.innerHeight - widgetHeight - 20 },
+    "bottom-center": { x: window.innerWidth / 2 - widgetWidth / 2, y: window.innerHeight - widgetHeight - 20 },
+    "bottom-right": { x: window.innerWidth - widgetWidth - 20, y: window.innerHeight - widgetHeight - 20 }
+  };
+  const buttonConfig = [
+    // Top row
+    { id: "top-left", emoji: "↖", title: "Top Left" },
+    { id: "top-center", emoji: "↑", title: "Top Center" },
+    { id: "top-right", emoji: "↗", title: "Top Right" },
+    // Middle row
+    { id: "middle-left", emoji: "←", title: "Middle Left" },
+    { id: "toggle", emoji: "🔧", title: "Toggle DevTools Panel", isToggle: true },
+    { id: "middle-right", emoji: "→", title: "Middle Right" },
+    // Bottom row
+    { id: "bottom-left", emoji: "↙", title: "Bottom Left" },
+    { id: "bottom-center", emoji: "↓", title: "Bottom Center" },
+    { id: "bottom-right", emoji: "↘", title: "Bottom Right" }
+  ];
+  const [position, setPosition] = useState(positionPresets["bottom-right"]);
+  const snapToPosition = (presetName) => {
+    setPosition(positionPresets[presetName]);
+  };
+  const handleDragStop = (e2, data) => {
+    setPosition({ x: data.x, y: data.y });
+  };
+  const renderButton = (config) => {
+    const baseStyle = {
+      cursor: "pointer",
+      fontSize: "24px",
+      width: "28px",
+      height: "28px",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      transition: "opacity 0.2s, transform 0.1s",
+      pointerEvents: "auto",
+      userSelect: "none",
+      fontVariantEmoji: "text",
+      textRendering: "optimizeLegibility",
+      WebkitFontSmoothing: "antialiased",
+      MozOsxFontSmoothing: "grayscale",
+      color: "white",
+      fontWeight: "bold"
+    };
+    if (config.isToggle) {
+      return /* @__PURE__ */ u(
+        "div",
+        {
+          onClick,
+          title: config.title,
+          role: "button",
+          tabIndex: 0,
+          style: {
+            ...baseStyle,
+            opacity: isActive ? 1 : 0.7
+          },
+          onMouseEnter: (e2) => {
+            e2.currentTarget.style.opacity = "1";
+            e2.currentTarget.style.transform = "scale(1.2)";
+          },
+          onMouseLeave: (e2) => {
+            e2.currentTarget.style.opacity = isActive ? "1" : "0.7";
+            e2.currentTarget.style.transform = "scale(1)";
+          },
+          children: config.emoji
+        },
+        config.id
+      );
+    }
+    return /* @__PURE__ */ u(
+      "div",
+      {
+        onClick: () => snapToPosition(config.id),
+        title: config.title,
+        role: "button",
+        tabIndex: 0,
+        style: {
+          ...baseStyle,
+          opacity: 0.6
+        },
+        onMouseEnter: (e2) => {
+          e2.currentTarget.style.opacity = "1";
+          e2.currentTarget.style.transform = "scale(1.2)";
+        },
+        onMouseLeave: (e2) => {
+          e2.currentTarget.style.opacity = "0.6";
+          e2.currentTarget.style.transform = "scale(1)";
+        },
+        children: config.emoji
+      },
+      config.id
+    );
+  };
+  return /* @__PURE__ */ u(
+    Draggable$1,
+    {
+      position,
+      onStop: handleDragStop,
+      handle: ".drag-handle",
+      children: /* @__PURE__ */ u(
+        Pane,
+        {
+          position: "fixed",
+          width: "fit-content",
+          background: "#1a202c",
+          borderRadius: 8,
+          boxShadow: "0 4px 12px rgba(0,0,0,0.4)",
+          border: "1px solid #4a5568",
+          zIndex: 999999,
+          style: { cursor: "default", pointerEvents: "auto" },
+          children: [
+            /* @__PURE__ */ u(
+              Pane,
+              {
+                className: "drag-handle",
+                cursor: "grab",
+                padding: 6,
+                textAlign: "center",
+                borderBottom: "1px solid #4a5568",
+                background: "#0d1f28",
+                borderTopLeftRadius: 8,
+                borderTopRightRadius: 8,
+                userSelect: "none",
+                style: {
+                  transition: "background 0.2s"
+                },
+                onMouseEnter: (e2) => {
+                  e2.currentTarget.style.background = "#1a3d4d";
+                },
+                onMouseLeave: (e2) => {
+                  e2.currentTarget.style.background = "#0d1f28";
+                },
+                children: /* @__PURE__ */ u(Text, { size: 300, color: "#718096", fontWeight: 600, children: "⋮⋮ drag ⋮⋮" })
+              }
+            ),
+            /* @__PURE__ */ u(
+              Pane,
+              {
+                display: "grid",
+                gridTemplateColumns: "28px 28px 28px",
+                gridTemplateRows: "28px 28px 28px",
+                gap: 6,
+                padding: 8,
+                background: "#0d1f28",
+                style: { pointerEvents: "auto" },
+                children: buttonConfig.map(renderButton)
+              }
+            ),
+            /* @__PURE__ */ u(
+              Pane,
+              {
+                padding: 6,
+                textAlign: "center",
+                borderTop: "1px solid #4a5568",
+                background: logCount > 0 ? "#2d3748" : "#0d1f28",
+                borderBottomLeftRadius: 8,
+                borderBottomRightRadius: 8,
+                children: /* @__PURE__ */ u(
+                  Text,
+                  {
+                    size: 300,
+                    color: logCount > 0 ? "#48bb78" : "#a0aec0",
+                    fontWeight: logCount > 0 ? 600 : 400,
+                    children: [
+                      "# of logs: ",
+                      logCount
+                    ]
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+const LOG_LEVELS = [
+  { value: 0, name: "SILENT", emoji: "🔇", color: "#718096" },
+  { value: 1, name: "ERROR", emoji: "🚨", color: "#E53E3E" },
+  { value: 2, name: "WARN", emoji: "⚠️", color: "#DD6B20" },
+  { value: 3, name: "INFO", emoji: "✨", color: "#3182CE" },
+  { value: 4, name: "DEBUG", emoji: "🐛", color: "#805AD5" },
+  { value: 5, name: "TRACE", emoji: "🔍", color: "#38A169" }
+];
+const levelNameToValue = {
+  "silent": 0,
+  "error": 1,
+  "warn": 2,
+  "info": 3,
+  "debug": 4,
+  "trace": 5
+};
+const levelValueToName = {
+  0: "silent",
+  1: "error",
+  2: "warn",
+  3: "info",
+  4: "debug",
+  5: "trace"
+};
+function ComponentFilters({ components, loggerControls, onLevelChange }) {
+  const [componentLevels, setComponentLevels] = useState({});
+  useEffect(() => {
+    const levels = {};
+    components.forEach((name) => {
+      var _a;
+      const level = ((_a = loggerControls.getLevel) == null ? void 0 : _a.call(loggerControls, name)) || "info";
+      levels[name] = levelNameToValue[level] ?? 3;
+    });
+    setComponentLevels(levels);
+  }, [components, loggerControls]);
+  const handleLevelChange = (componentName, sliderValue) => {
+    const newLevel = levelValueToName[sliderValue];
+    setComponentLevels((prev) => ({
+      ...prev,
+      [componentName]: sliderValue
+    }));
+    onLevelChange == null ? void 0 : onLevelChange(componentName, newLevel);
+  };
+  if (components.length === 0) {
+    return /* @__PURE__ */ u(Pane, { marginBottom: 24, children: [
+      /* @__PURE__ */ u(
+        Heading,
+        {
+          size: 500,
+          marginBottom: 12,
+          color: "muted",
+          borderBottom: "1px solid",
+          borderColor: "border.muted",
+          paddingBottom: 8,
+          children: "📦 Components"
+        }
+      ),
+      /* @__PURE__ */ u(Text, { color: "muted", fontStyle: "italic", children: "No components detected" })
+    ] });
+  }
+  return /* @__PURE__ */ u(Pane, { marginBottom: 16, children: components.map((componentName) => {
+    const currentLevel = componentLevels[componentName] ?? 3;
+    const levelConfig = LOG_LEVELS[currentLevel];
+    return /* @__PURE__ */ u(
+      Pane,
+      {
+        paddingY: 16,
+        paddingX: 16,
+        marginY: 8,
+        background: "#2d3748",
+        borderRadius: 8,
+        border: "1px solid #3a4553",
+        transition: "all 0.2s",
+        children: [
+          /* @__PURE__ */ u(
+            Pane,
+            {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              marginBottom: 12,
+              border: "none",
+              borderWidth: 0,
+              outline: "none",
+              boxShadow: "none",
+              children: [
+                /* @__PURE__ */ u(Text, { size: 400, color: "#e2e8f0", fontWeight: "600", children: componentName }),
+                /* @__PURE__ */ u(
+                  Pane,
+                  {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: 8,
+                    border: "none",
+                    borderWidth: 0,
+                    outline: "none",
+                    boxShadow: "none",
+                    children: [
+                      /* @__PURE__ */ u(Text, { fontSize: "14px", color: levelConfig.color, children: levelConfig.emoji }),
+                      /* @__PURE__ */ u(
+                        Pane,
+                        {
+                          paddingX: 8,
+                          paddingY: 4,
+                          backgroundColor: levelConfig.color,
+                          borderRadius: 12,
+                          border: "none",
+                          borderWidth: 0,
+                          outline: "none",
+                          boxShadow: "none",
+                          children: /* @__PURE__ */ u(
+                            Text,
+                            {
+                              fontSize: "11px",
+                              fontWeight: "600",
+                              color: "white",
+                              children: levelConfig.name
+                            }
+                          )
+                        }
+                      )
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ u(Pane, { display: "flex", marginBottom: 12, borderRadius: 6, overflow: "hidden", children: LOG_LEVELS.map((level, index) => /* @__PURE__ */ u(
+            Button,
+            {
+              appearance: "minimal",
+              size: "small",
+              height: 32,
+              flex: 1,
+              borderRadius: 0,
+              border: "none",
+              background: currentLevel === index ? level.color : "transparent",
+              color: currentLevel === index ? "white" : level.color,
+              onClick: () => handleLevelChange(componentName, level.value),
+              title: `Set to ${level.name}`,
+              style: {
+                transition: "all 0.2s ease",
+                fontWeight: currentLevel === index ? "600" : "400"
+              },
+              children: level.emoji
+            },
+            level.value
+          )) }),
+          /* @__PURE__ */ u(Pane, { display: "flex", justifyContent: "space-between", paddingX: 4, children: LOG_LEVELS.map((level, index) => /* @__PURE__ */ u(
+            Text,
+            {
+              fontSize: "9px",
+              color: currentLevel === index ? level.color : "#718096",
+              fontWeight: currentLevel === index ? "600" : "400",
+              textAlign: "center",
+              width: `${100 / 6}%`,
+              children: level.name
+            },
+            level.value
+          )) })
+        ]
+      },
+      componentName
+    );
+  }) });
+}
+function GlobalControls({ onDebugAll, onTraceAll, onReset, loggerControls }) {
+  var _a, _b;
+  const stats = ((_a = loggerControls.getStats) == null ? void 0 : _a.call(loggerControls)) || { total: 0, byLevel: {} };
+  const configSummary = ((_b = loggerControls.getConfigSummary) == null ? void 0 : _b.call(loggerControls)) || {};
+  return /* @__PURE__ */ u(Pane, { marginBottom: 16, children: [
+    /* @__PURE__ */ u(Pane, { display: "flex", gap: 8, marginBottom: 16, flexWrap: "wrap", children: [
+      /* @__PURE__ */ u(
+        Button,
+        {
+          appearance: "primary",
+          intent: "success",
+          size: "medium",
+          flex: "1",
+          minWidth: 100,
+          onClick: onDebugAll,
+          title: "Enable debug level for all components",
+          children: "🐛 Debug All"
+        }
+      ),
+      /* @__PURE__ */ u(
+        Button,
+        {
+          appearance: "primary",
+          intent: "warning",
+          size: "medium",
+          flex: "1",
+          minWidth: 100,
+          onClick: onTraceAll,
+          title: "Enable trace level for all components",
+          children: "🔍 Trace All"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ u(Pane, { display: "flex", gap: 8, marginBottom: 16, flexWrap: "wrap", children: [
+      /* @__PURE__ */ u(
+        Button,
+        {
+          intent: "danger",
+          size: "small",
+          flex: "1",
+          minWidth: 80,
+          onClick: onReset,
+          title: "Reset all settings to defaults",
+          children: "Reset All"
+        }
+      ),
+      /* @__PURE__ */ u(
+        Button,
+        {
+          appearance: "default",
+          size: "small",
+          flex: "1",
+          minWidth: 80,
+          onClick: () => {
+            var _a2;
+            const summary = (_a2 = loggerControls.getConfigSummary) == null ? void 0 : _a2.call(loggerControls);
+            console.log("[JSG-DEVTOOLS] Current Config:", summary);
+            alert("Config exported to console");
+          },
+          title: "Export current configuration to console",
+          children: "Export Config"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ u(
+      Pane,
+      {
+        background: "#2d3748",
+        paddingX: 12,
+        paddingY: 8,
+        borderRadius: 6,
+        marginTop: 12,
+        border: "1px solid #4a5568",
+        children: [
+          /* @__PURE__ */ u(Pane, { display: "flex", justifyContent: "space-between", alignItems: "center", paddingY: 2, children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#a0aec0", children: "📊 Total Logs:" }),
+            /* @__PURE__ */ u(Text, { size: 300, color: "#ffffff", fontWeight: "600", children: stats.total.toString() })
+          ] }),
+          stats.byLevel && Object.keys(stats.byLevel).length > 0 && /* @__PURE__ */ u(Pane, { display: "flex", justifyContent: "space-between", alignItems: "center", paddingY: 2, children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#a0aec0", children: "📈 By Level:" }),
+            /* @__PURE__ */ u(Text, { size: 300, color: "#e2e8f0", fontFamily: "mono", children: Object.entries(stats.byLevel).map(([level, count]) => `${level}:${count}`).join(" ") })
+          ] }),
+          configSummary.environment && /* @__PURE__ */ u(Pane, { display: "flex", justifyContent: "space-between", alignItems: "center", paddingY: 2, children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#a0aec0", children: "🌍 Environment:" }),
+            /* @__PURE__ */ u(Text, { size: 300, color: "#ffffff", fontWeight: "600", children: configSummary.environment })
+          ] }),
+          configSummary.fileOverrides && /* @__PURE__ */ u(Pane, { display: "flex", justifyContent: "space-between", alignItems: "center", paddingY: 2, children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#a0aec0", children: "📁 File Overrides:" }),
+            /* @__PURE__ */ u(
+              Text,
+              {
+                size: 300,
+                color: "#ffffff",
+                fontWeight: "600",
+                children: configSummary.fileOverrides.toString()
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function LogPreview({ displayOptions, timestampMode }) {
+  const previewStyle = {
+    fontFamily: 'Monaco, Consolas, "Courier New", monospace',
+    fontSize: "12px",
+    lineHeight: "1.6",
+    whiteSpace: "pre-wrap",
+    color: "#e2e8f0"
+  };
+  const timestampStyle = { color: "#a0aec0" };
+  const emojiStyle = { marginRight: "6px" };
+  const levelStyle = { color: "#f6ad55", fontWeight: "600" };
+  const componentStyle = { color: "#4299e1", fontWeight: "600" };
+  const messageStyle = { color: "#e2e8f0" };
+  const contextKeyStyle = { color: "#9ae6b4" };
+  const contextValueStyle = { color: "#cbd5e0" };
+  const getTimestamp = () => {
+    switch (timestampMode) {
+      case "absolute":
+        return "22:15:30.1";
+      case "readable":
+        return "10:15 PM";
+      case "relative":
+        return "2s ago";
+      case "disable":
+        return null;
+      default:
+        return "22:15:30.1";
+    }
+  };
+  const timestamp = getTimestamp();
+  return /* @__PURE__ */ u(
+    Pane,
+    {
+      background: "#2d3748",
+      padding: 12,
+      borderRadius: 6,
+      border: "1px solid #4a5568",
+      children: /* @__PURE__ */ u(Pane, { style: previewStyle, children: [
+        /* @__PURE__ */ u("div", { children: [
+          displayOptions.timestamp && timestamp && /* @__PURE__ */ u("span", { style: timestampStyle, children: [
+            timestamp,
+            " "
+          ] }),
+          displayOptions.emoji && /* @__PURE__ */ u("span", { style: emojiStyle, children: "🌐" }),
+          displayOptions.level && /* @__PURE__ */ u("span", { style: levelStyle, children: "INFO " }),
+          displayOptions.component && /* @__PURE__ */ u("span", { style: componentStyle, children: "[API] " }),
+          displayOptions.message && /* @__PURE__ */ u("span", { style: messageStyle, children: "Request completed successfully" })
+        ] }),
+        displayOptions.jsonPayload && /* @__PURE__ */ u(Fragment, { children: [
+          /* @__PURE__ */ u("div", { children: [
+            /* @__PURE__ */ u("span", { style: contextKeyStyle, children: "   ├─ endpoint: " }),
+            /* @__PURE__ */ u("span", { style: contextValueStyle, children: "/api/users/profile" })
+          ] }),
+          /* @__PURE__ */ u("div", { children: [
+            /* @__PURE__ */ u("span", { style: contextKeyStyle, children: "   ├─ status: " }),
+            /* @__PURE__ */ u("span", { style: contextValueStyle, children: "200" })
+          ] }),
+          /* @__PURE__ */ u("div", { children: [
+            /* @__PURE__ */ u("span", { style: contextKeyStyle, children: "   ├─ duration: " }),
+            /* @__PURE__ */ u("span", { style: contextValueStyle, children: "145ms" })
+          ] }),
+          /* @__PURE__ */ u("div", { children: [
+            /* @__PURE__ */ u("span", { style: contextKeyStyle, children: "   └─ cached: " }),
+            /* @__PURE__ */ u("span", { style: contextValueStyle, children: "false" })
+          ] })
+        ] }),
+        displayOptions.stackTrace && /* @__PURE__ */ u(Pane, { marginTop: 8, opacity: 0.7, children: [
+          /* @__PURE__ */ u("div", { style: { color: "#fc8181" }, children: " at processRequest (api.js:42:15)" }),
+          /* @__PURE__ */ u("div", { style: { color: "#fc8181" }, children: " at handleRoute (router.js:128:8)" })
+        ] })
+      ] })
+    }
+  );
+}
+function DisplayControls({ loggerControls, onStateChange }) {
+  const [timestampMode, setTimestampMode] = useState("absolute");
+  const [displayOptions, setDisplayOptions] = useState({
+    timestamp: true,
+    emoji: true,
+    component: true,
+    level: false,
+    message: true,
+    jsonPayload: true,
+    stackTrace: true
+  });
+  useEffect(() => {
+    var _a, _b;
+    if (loggerControls) {
+      try {
+        const config = (_a = loggerControls.getDisplayConfig) == null ? void 0 : _a.call(loggerControls);
+        if (config) {
+          setDisplayOptions((prev) => ({
+            ...prev,
+            ...config
+          }));
+        }
+        const currentTimestampMode = (_b = loggerControls.getTimestampMode) == null ? void 0 : _b.call(loggerControls);
+        if (currentTimestampMode) {
+          setTimestampMode(currentTimestampMode);
+        }
+      } catch (error) {
+        console.warn("[DisplayControls] Failed to load config:", error);
+      }
+    }
+  }, [loggerControls]);
+  useEffect(() => {
+    if (onStateChange) {
+      onStateChange({ displayOptions, timestampMode });
+    }
+  }, [displayOptions, timestampMode, onStateChange]);
+  const handleTimestampModeChange = (mode) => {
+    var _a;
+    setTimestampMode(mode);
+    const isVisible = mode !== "disable";
+    setDisplayOptions((prev) => ({ ...prev, timestamp: isVisible }));
+    try {
+      (_a = loggerControls.setTimestampMode) == null ? void 0 : _a.call(loggerControls, mode);
+      console.log(`[JSG-DEVTOOLS] Timestamp mode changed to: ${mode}`);
+    } catch (error) {
+      console.warn("[DisplayControls] Failed to set timestamp mode:", error);
+    }
+  };
+  const handleToggle = (option) => {
+    var _a;
+    const newValue = !displayOptions[option];
+    setDisplayOptions((prev) => ({
+      ...prev,
+      [option]: newValue
+    }));
+    try {
+      (_a = loggerControls.setDisplayOption) == null ? void 0 : _a.call(loggerControls, option, newValue);
+      console.log(`[JSG-DEVTOOLS] Display option '${option}' set to: ${newValue}`);
+    } catch (error) {
+      console.warn(`[DisplayControls] Failed to set ${option}:`, error);
+    }
+  };
+  const handleAllOn = () => {
+    var _a;
+    const allOn = {
+      timestamp: true,
+      emoji: true,
+      component: true,
+      level: true,
+      message: true,
+      jsonPayload: true,
+      stackTrace: true
+    };
+    setDisplayOptions(allOn);
+    setTimestampMode("absolute");
+    try {
+      Object.entries(allOn).forEach(([key, value]) => {
+        var _a2;
+        (_a2 = loggerControls.setDisplayOption) == null ? void 0 : _a2.call(loggerControls, key, value);
+      });
+      (_a = loggerControls.setTimestampMode) == null ? void 0 : _a.call(loggerControls, "absolute");
+      console.log("[JSG-DEVTOOLS] All display options enabled");
+    } catch (error) {
+      console.warn("[DisplayControls] Failed to enable all options:", error);
+    }
+  };
+  const handleAllOff = () => {
+    var _a;
+    const allOff = {
+      timestamp: false,
+      emoji: false,
+      component: false,
+      level: false,
+      message: true,
+      // Keep message always on
+      jsonPayload: false,
+      stackTrace: false
+    };
+    setDisplayOptions(allOff);
+    setTimestampMode("disable");
+    try {
+      Object.entries(allOff).forEach(([key, value]) => {
+        var _a2;
+        (_a2 = loggerControls.setDisplayOption) == null ? void 0 : _a2.call(loggerControls, key, value);
+      });
+      (_a = loggerControls.setTimestampMode) == null ? void 0 : _a.call(loggerControls, "disable");
+      console.log("[JSG-DEVTOOLS] All display options disabled (message kept on)");
+    } catch (error) {
+      console.warn("[DisplayControls] Failed to disable all options:", error);
+    }
+  };
+  const handleReset = () => {
+    var _a;
+    const defaults = {
+      timestamp: true,
+      emoji: true,
+      component: true,
+      level: false,
+      message: true,
+      jsonPayload: true,
+      stackTrace: true
+    };
+    setDisplayOptions(defaults);
+    setTimestampMode("absolute");
+    try {
+      Object.entries(defaults).forEach(([key, value]) => {
+        var _a2;
+        (_a2 = loggerControls.setDisplayOption) == null ? void 0 : _a2.call(loggerControls, key, value);
+      });
+      (_a = loggerControls.setTimestampMode) == null ? void 0 : _a.call(loggerControls, "absolute");
+      console.log("[JSG-DEVTOOLS] Display options reset to defaults");
+    } catch (error) {
+      console.warn("[DisplayControls] Failed to reset options:", error);
+    }
+  };
+  const timestampOptions = [
+    { label: "Absolute", value: "absolute" },
+    { label: "Readable", value: "readable" },
+    { label: "Relative", value: "relative" },
+    { label: "Off", value: "disable" }
+  ];
+  return /* @__PURE__ */ u(Pane, { paddingX: 20, paddingY: 16, children: [
+    /* @__PURE__ */ u(Pane, { marginBottom: 12, children: /* @__PURE__ */ u(Pane, { display: "flex", gap: 4, children: timestampOptions.map((option) => /* @__PURE__ */ u(
+      Button,
+      {
+        size: "small",
+        appearance: timestampMode === option.value ? "primary" : "default",
+        onClick: () => handleTimestampModeChange(option.value),
+        flex: "1",
+        children: option.label
+      },
+      option.value
+    )) }) }),
+    /* @__PURE__ */ u(
+      Pane,
+      {
+        display: "grid",
+        gridTemplateColumns: "1fr 1fr",
+        gap: 12,
+        marginBottom: 12,
+        children: [
+          /* @__PURE__ */ u(Pane, { display: "flex", alignItems: "center", justifyContent: "space-between", children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#e2e8f0", children: "😀 Emoji" }),
+            /* @__PURE__ */ u(
+              Switch,
+              {
+                checked: displayOptions.emoji,
+                onChange: () => handleToggle("emoji"),
+                height: 20
+              }
+            )
+          ] }),
+          /* @__PURE__ */ u(Pane, { display: "flex", alignItems: "center", justifyContent: "space-between", children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#e2e8f0", children: "📦 Component" }),
+            /* @__PURE__ */ u(
+              Switch,
+              {
+                checked: displayOptions.component,
+                onChange: () => handleToggle("component"),
+                height: 20
+              }
+            )
+          ] }),
+          /* @__PURE__ */ u(Pane, { display: "flex", alignItems: "center", justifyContent: "space-between", children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#e2e8f0", children: "📊 Level Name" }),
+            /* @__PURE__ */ u(
+              Switch,
+              {
+                checked: displayOptions.level,
+                onChange: () => handleToggle("level"),
+                height: 20
+              }
+            )
+          ] }),
+          /* @__PURE__ */ u(Pane, { display: "flex", alignItems: "center", justifyContent: "space-between", opacity: 0.5, children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#e2e8f0", children: "💬 Message" }),
+            /* @__PURE__ */ u(
+              Switch,
+              {
+                checked: displayOptions.message,
+                disabled: true,
+                height: 20
+              }
+            )
+          ] }),
+          /* @__PURE__ */ u(Pane, { display: "flex", alignItems: "center", justifyContent: "space-between", children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#e2e8f0", children: "📋 JSON Data" }),
+            /* @__PURE__ */ u(
+              Switch,
+              {
+                checked: displayOptions.jsonPayload,
+                onChange: () => handleToggle("jsonPayload"),
+                height: 20
+              }
+            )
+          ] }),
+          /* @__PURE__ */ u(Pane, { display: "flex", alignItems: "center", justifyContent: "space-between", children: [
+            /* @__PURE__ */ u(Text, { size: 300, color: "#e2e8f0", children: "📚 Stack Trace" }),
+            /* @__PURE__ */ u(
+              Switch,
+              {
+                checked: displayOptions.stackTrace,
+                onChange: () => handleToggle("stackTrace"),
+                height: 20
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ u(Pane, { display: "flex", gap: 8, flexWrap: "wrap", children: [
+      /* @__PURE__ */ u(
+        Button,
+        {
+          size: "small",
+          appearance: "primary",
+          intent: "success",
+          onClick: handleAllOn,
+          flex: "1",
+          minWidth: 80,
+          children: "✅ All On"
+        }
+      ),
+      /* @__PURE__ */ u(
+        Button,
+        {
+          size: "small",
+          appearance: "default",
+          onClick: handleAllOff,
+          flex: "1",
+          minWidth: 80,
+          children: "❌ All Off"
+        }
+      ),
+      /* @__PURE__ */ u(
+        Button,
+        {
+          size: "small",
+          appearance: "default",
+          onClick: handleReset,
+          flex: "1",
+          minWidth: 80,
+          children: "↻ Reset"
+        }
+      )
+    ] })
+  ] });
+}
+function PanelContainer({
+  components,
+  loggerControls,
+  onLevelChange,
+  onGlobalDebug,
+  onGlobalTrace,
+  onReset,
+  onClose,
+  isClosing
+}) {
+  const panelContainerStyle = {
+    position: "fixed",
+    top: "0",
+    left: "0",
+    width: "380px",
+    // Slightly narrower since we're using segmented controls
+    height: "100vh",
+    zIndex: "999998",
+    pointerEvents: "all",
+    overflow: "auto",
+    animation: isClosing ? "slideOut 0.3s ease-in" : "slideIn 0.3s ease-out"
+  };
+  if (!document.getElementById("jsg-devtools-styles")) {
+    const styleSheet = document.createElement("style");
+    styleSheet.id = "jsg-devtools-styles";
+    styleSheet.textContent = `
+            @keyframes slideIn {
+                from { transform: translateX(-100%); }
+                to { transform: translateX(0); }
+            }
+            
+            @keyframes slideOut {
+                from { transform: translateX(0); }
+                to { transform: translateX(-100%); }
+            }
+        `;
+    document.head.appendChild(styleSheet);
+  }
+  const [previewState, setPreviewState] = useState({
+    displayOptions: {
+      timestamp: true,
+      emoji: true,
+      component: true,
+      level: false,
+      message: true,
+      jsonPayload: true,
+      stackTrace: true
+    },
+    timestampMode: "absolute"
+  });
+  const [showPreviewControls, setShowPreviewControls] = useState(true);
+  return /* @__PURE__ */ u(
+    Pane,
+    {
+      style: panelContainerStyle,
+      background: "#0d1f28",
+      boxShadow: "2px 0 8px rgba(0,0,0,0.3)",
+      fontSize: 14,
+      borderRight: "1px solid #22577a",
+      children: [
+        /* @__PURE__ */ u(
+          Pane,
+          {
+            position: "sticky",
+            top: 0,
+            background: "#1a3d4d",
+            zIndex: 999999,
+            borderBottom: "1px solid #22577a",
+            children: [
+              /* @__PURE__ */ u(
+                Pane,
+                {
+                  paddingX: 16,
+                  paddingY: 12,
+                  display: "flex",
+                  justifyContent: "space-between",
+                  alignItems: "center",
+                  children: [
+                    /* @__PURE__ */ u(Heading, { size: 500, color: "#ffffff", fontWeight: "600", children: "🔧 Logger Controls" }),
+                    /* @__PURE__ */ u(Pane, { display: "flex", gap: 12, alignItems: "center", children: [
+                      /* @__PURE__ */ u(
+                        Switch,
+                        {
+                          checked: showPreviewControls,
+                          onChange: (e2) => setShowPreviewControls(e2.target.checked),
+                          height: 20
+                        }
+                      ),
+                      /* @__PURE__ */ u(
+                        Button,
+                        {
+                          appearance: "minimal",
+                          onClick: onClose,
+                          title: "Close DevTools panel",
+                          size: "small",
+                          color: "#8b949e",
+                          children: "×"
+                        }
+                      )
+                    ] })
+                  ]
+                }
+              ),
+              showPreviewControls && /* @__PURE__ */ u(Fragment, { children: [
+                /* @__PURE__ */ u(Pane, { paddingX: 16, paddingBottom: 12, children: /* @__PURE__ */ u(
+                  LogPreview,
+                  {
+                    displayOptions: previewState.displayOptions,
+                    timestampMode: previewState.timestampMode
+                  }
+                ) }),
+                /* @__PURE__ */ u(
+                  DisplayControls,
+                  {
+                    loggerControls,
+                    onStateChange: setPreviewState
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ u(Pane, { paddingBottom: 20, children: /* @__PURE__ */ u(Pane, { paddingX: 20, children: [
+          /* @__PURE__ */ u(
+            ComponentFilters,
+            {
+              components,
+              loggerControls,
+              onLevelChange
+            }
+          ),
+          /* @__PURE__ */ u(
+            GlobalControls,
+            {
+              onDebugAll: onGlobalDebug,
+              onTraceAll: onGlobalTrace,
+              onReset,
+              loggerControls
+            }
+          )
+        ] }) })
+      ]
+    }
+  );
+}
+function DevToolsPanel({ loggerControls, onUnmount }) {
+  const [isPanelOpen, setIsPanelOpen] = useState(true);
+  const [isClosing, setIsClosing] = useState(false);
+  const [components, setComponents] = useState([]);
+  const [loggerStats, setLoggerStats] = useState({ total: 0 });
+  useEffect(() => {
+    var _a, _b, _c;
+    if (loggerControls) {
+      const componentList = ((_a = loggerControls.listComponents) == null ? void 0 : _a.call(loggerControls)) || [];
+      setComponents(componentList);
+      const stats = ((_b = loggerControls.getStats) == null ? void 0 : _b.call(loggerControls)) || { total: 0 };
+      setLoggerStats(stats);
+      const unsubscribe = (_c = loggerControls.subscribe) == null ? void 0 : _c.call(loggerControls, (logEntry, allLogs) => {
+        var _a2;
+        const updatedStats = ((_a2 = loggerControls.getStats) == null ? void 0 : _a2.call(loggerControls)) || { total: 0 };
+        setLoggerStats(updatedStats);
+      });
+      return () => {
+        if (unsubscribe) unsubscribe();
+      };
+    }
+  }, [loggerControls]);
+  useEffect(() => {
+    if (isPanelOpen && !isClosing) {
+      document.body.classList.add("jsg-devtools-panel-open");
+      document.body.classList.remove("jsg-devtools-panel-closing");
+    } else if (isClosing) {
+      document.body.classList.remove("jsg-devtools-panel-open");
+      document.body.classList.add("jsg-devtools-panel-closing");
+    } else {
+      document.body.classList.remove("jsg-devtools-panel-open");
+      document.body.classList.remove("jsg-devtools-panel-closing");
+    }
+    return () => {
+      document.body.classList.remove("jsg-devtools-panel-open");
+      document.body.classList.remove("jsg-devtools-panel-closing");
+    };
+  }, [isPanelOpen, isClosing]);
+  const handleClose = () => {
+    setIsClosing(true);
+    setTimeout(() => {
+      setIsPanelOpen(false);
+      setIsClosing(false);
+    }, 300);
+  };
+  const handleTogglePanel = () => {
+    if (!isPanelOpen) {
+      setIsPanelOpen(true);
+    } else {
+      handleClose();
+    }
+  };
+  const handleLevelChange = (componentName, newLevel) => {
+    var _a;
+    (_a = loggerControls.setLevel) == null ? void 0 : _a.call(loggerControls, componentName, newLevel);
+    console.log(`[JSG-DEVTOOLS] Changed ${componentName} level to: ${newLevel.toUpperCase()}`);
+  };
+  const handleGlobalDebug = () => {
+    var _a;
+    (_a = loggerControls.enableDebugMode) == null ? void 0 : _a.call(loggerControls);
+    console.log("[JSG-DEVTOOLS] Enabled debug mode for all components");
+  };
+  const handleGlobalTrace = () => {
+    var _a;
+    (_a = loggerControls.enableTraceMode) == null ? void 0 : _a.call(loggerControls);
+    console.log("[JSG-DEVTOOLS] Enabled trace mode for all components");
+  };
+  const handleReset = () => {
+    var _a;
+    (_a = loggerControls.reset) == null ? void 0 : _a.call(loggerControls);
+    console.log("[JSG-DEVTOOLS] Reset all settings to defaults");
+  };
+  useEffect(() => {
+    if (onUnmount) {
+      onUnmount(handleClose);
+    }
+  }, [onUnmount]);
+  return /* @__PURE__ */ u("div", { children: [
+    /* @__PURE__ */ u(
+      FloatingButton,
+      {
+        onClick: handleTogglePanel,
+        isActive: isPanelOpen,
+        logCount: loggerStats.total
+      }
+    ),
+    isPanelOpen && /* @__PURE__ */ u(
+      PanelContainer,
+      {
+        components,
+        loggerControls,
+        onLevelChange: handleLevelChange,
+        onGlobalDebug: handleGlobalDebug,
+        onGlobalTrace: handleGlobalTrace,
+        onReset: handleReset,
+        onClose: handleClose,
+        isClosing
+      }
+    )
+  ] });
+}
+var lodash_merge = { exports: {} };
+lodash_merge.exports;
+(function(module, exports) {
+  var LARGE_ARRAY_SIZE = 200;
+  var HASH_UNDEFINED = "__lodash_hash_undefined__";
+  var HOT_COUNT = 800, HOT_SPAN = 16;
+  var MAX_SAFE_INTEGER = 9007199254740991;
+  var argsTag = "[object Arguments]", arrayTag = "[object Array]", asyncTag = "[object AsyncFunction]", boolTag = "[object Boolean]", dateTag = "[object Date]", errorTag = "[object Error]", funcTag = "[object Function]", genTag = "[object GeneratorFunction]", mapTag = "[object Map]", numberTag = "[object Number]", nullTag = "[object Null]", objectTag = "[object Object]", proxyTag = "[object Proxy]", regexpTag = "[object RegExp]", setTag = "[object Set]", stringTag = "[object String]", undefinedTag = "[object Undefined]", weakMapTag = "[object WeakMap]";
+  var arrayBufferTag = "[object ArrayBuffer]", dataViewTag = "[object DataView]", float32Tag = "[object Float32Array]", float64Tag = "[object Float64Array]", int8Tag = "[object Int8Array]", int16Tag = "[object Int16Array]", int32Tag = "[object Int32Array]", uint8Tag = "[object Uint8Array]", uint8ClampedTag = "[object Uint8ClampedArray]", uint16Tag = "[object Uint16Array]", uint32Tag = "[object Uint32Array]";
+  var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
+  var reIsHostCtor = /^\[object .+?Constructor\]$/;
+  var reIsUint = /^(?:0|[1-9]\d*)$/;
+  var typedArrayTags = {};
+  typedArrayTags[float32Tag] = typedArrayTags[float64Tag] = typedArrayTags[int8Tag] = typedArrayTags[int16Tag] = typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] = typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] = typedArrayTags[uint32Tag] = true;
+  typedArrayTags[argsTag] = typedArrayTags[arrayTag] = typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] = typedArrayTags[dataViewTag] = typedArrayTags[dateTag] = typedArrayTags[errorTag] = typedArrayTags[funcTag] = typedArrayTags[mapTag] = typedArrayTags[numberTag] = typedArrayTags[objectTag] = typedArrayTags[regexpTag] = typedArrayTags[setTag] = typedArrayTags[stringTag] = typedArrayTags[weakMapTag] = false;
+  var freeGlobal = typeof commonjsGlobal == "object" && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
+  var freeSelf = typeof self == "object" && self && self.Object === Object && self;
+  var root = freeGlobal || freeSelf || Function("return this")();
+  var freeExports = exports && !exports.nodeType && exports;
+  var freeModule = freeExports && true && module && !module.nodeType && module;
+  var moduleExports = freeModule && freeModule.exports === freeExports;
+  var freeProcess = moduleExports && freeGlobal.process;
+  var nodeUtil = function() {
+    try {
+      var types = freeModule && freeModule.require && freeModule.require("util").types;
+      if (types) {
+        return types;
+      }
+      return freeProcess && freeProcess.binding && freeProcess.binding("util");
+    } catch (e2) {
+    }
+  }();
+  var nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;
+  function apply(func, thisArg, args) {
+    switch (args.length) {
+      case 0:
+        return func.call(thisArg);
+      case 1:
+        return func.call(thisArg, args[0]);
+      case 2:
+        return func.call(thisArg, args[0], args[1]);
+      case 3:
+        return func.call(thisArg, args[0], args[1], args[2]);
+    }
+    return func.apply(thisArg, args);
+  }
+  function baseTimes(n, iteratee) {
+    var index = -1, result = Array(n);
+    while (++index < n) {
+      result[index] = iteratee(index);
+    }
+    return result;
+  }
+  function baseUnary(func) {
+    return function(value) {
+      return func(value);
+    };
+  }
+  function getValue(object, key) {
+    return object == null ? void 0 : object[key];
+  }
+  function overArg(func, transform) {
+    return function(arg) {
+      return func(transform(arg));
+    };
+  }
+  var arrayProto = Array.prototype, funcProto = Function.prototype, objectProto = Object.prototype;
+  var coreJsData = root["__core-js_shared__"];
+  var funcToString = funcProto.toString;
+  var hasOwnProperty = objectProto.hasOwnProperty;
+  var maskSrcKey = function() {
+    var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || "");
+    return uid ? "Symbol(src)_1." + uid : "";
+  }();
+  var nativeObjectToString = objectProto.toString;
+  var objectCtorString = funcToString.call(Object);
+  var reIsNative = RegExp(
+    "^" + funcToString.call(hasOwnProperty).replace(reRegExpChar, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
+  );
+  var Buffer = moduleExports ? root.Buffer : void 0, Symbol2 = root.Symbol, Uint8Array = root.Uint8Array;
+  Buffer ? Buffer.allocUnsafe : void 0;
+  var getPrototype = overArg(Object.getPrototypeOf, Object), objectCreate = Object.create, propertyIsEnumerable = objectProto.propertyIsEnumerable, splice = arrayProto.splice, symToStringTag = Symbol2 ? Symbol2.toStringTag : void 0;
+  var defineProperty = function() {
+    try {
+      var func = getNative(Object, "defineProperty");
+      func({}, "", {});
+      return func;
+    } catch (e2) {
+    }
+  }();
+  var nativeIsBuffer = Buffer ? Buffer.isBuffer : void 0, nativeMax = Math.max, nativeNow = Date.now;
+  var Map2 = getNative(root, "Map"), nativeCreate = getNative(Object, "create");
+  var baseCreate = /* @__PURE__ */ function() {
+    function object() {
+    }
+    return function(proto) {
+      if (!isObject(proto)) {
+        return {};
+      }
+      if (objectCreate) {
+        return objectCreate(proto);
+      }
+      object.prototype = proto;
+      var result = new object();
+      object.prototype = void 0;
+      return result;
+    };
+  }();
+  function Hash(entries) {
+    var index = -1, length = entries == null ? 0 : entries.length;
+    this.clear();
+    while (++index < length) {
+      var entry = entries[index];
+      this.set(entry[0], entry[1]);
+    }
+  }
+  function hashClear() {
+    this.__data__ = nativeCreate ? nativeCreate(null) : {};
+    this.size = 0;
+  }
+  function hashDelete(key) {
+    var result = this.has(key) && delete this.__data__[key];
+    this.size -= result ? 1 : 0;
+    return result;
+  }
+  function hashGet(key) {
+    var data = this.__data__;
+    if (nativeCreate) {
+      var result = data[key];
+      return result === HASH_UNDEFINED ? void 0 : result;
+    }
+    return hasOwnProperty.call(data, key) ? data[key] : void 0;
+  }
+  function hashHas(key) {
+    var data = this.__data__;
+    return nativeCreate ? data[key] !== void 0 : hasOwnProperty.call(data, key);
+  }
+  function hashSet(key, value) {
+    var data = this.__data__;
+    this.size += this.has(key) ? 0 : 1;
+    data[key] = nativeCreate && value === void 0 ? HASH_UNDEFINED : value;
+    return this;
+  }
+  Hash.prototype.clear = hashClear;
+  Hash.prototype["delete"] = hashDelete;
+  Hash.prototype.get = hashGet;
+  Hash.prototype.has = hashHas;
+  Hash.prototype.set = hashSet;
+  function ListCache(entries) {
+    var index = -1, length = entries == null ? 0 : entries.length;
+    this.clear();
+    while (++index < length) {
+      var entry = entries[index];
+      this.set(entry[0], entry[1]);
+    }
+  }
+  function listCacheClear() {
+    this.__data__ = [];
+    this.size = 0;
+  }
+  function listCacheDelete(key) {
+    var data = this.__data__, index = assocIndexOf(data, key);
+    if (index < 0) {
+      return false;
+    }
+    var lastIndex = data.length - 1;
+    if (index == lastIndex) {
+      data.pop();
+    } else {
+      splice.call(data, index, 1);
+    }
+    --this.size;
+    return true;
+  }
+  function listCacheGet(key) {
+    var data = this.__data__, index = assocIndexOf(data, key);
+    return index < 0 ? void 0 : data[index][1];
+  }
+  function listCacheHas(key) {
+    return assocIndexOf(this.__data__, key) > -1;
+  }
+  function listCacheSet(key, value) {
+    var data = this.__data__, index = assocIndexOf(data, key);
+    if (index < 0) {
+      ++this.size;
+      data.push([key, value]);
+    } else {
+      data[index][1] = value;
+    }
+    return this;
+  }
+  ListCache.prototype.clear = listCacheClear;
+  ListCache.prototype["delete"] = listCacheDelete;
+  ListCache.prototype.get = listCacheGet;
+  ListCache.prototype.has = listCacheHas;
+  ListCache.prototype.set = listCacheSet;
+  function MapCache(entries) {
+    var index = -1, length = entries == null ? 0 : entries.length;
+    this.clear();
+    while (++index < length) {
+      var entry = entries[index];
+      this.set(entry[0], entry[1]);
+    }
+  }
+  function mapCacheClear() {
+    this.size = 0;
+    this.__data__ = {
+      "hash": new Hash(),
+      "map": new (Map2 || ListCache)(),
+      "string": new Hash()
+    };
+  }
+  function mapCacheDelete(key) {
+    var result = getMapData(this, key)["delete"](key);
+    this.size -= result ? 1 : 0;
+    return result;
+  }
+  function mapCacheGet(key) {
+    return getMapData(this, key).get(key);
+  }
+  function mapCacheHas(key) {
+    return getMapData(this, key).has(key);
+  }
+  function mapCacheSet(key, value) {
+    var data = getMapData(this, key), size = data.size;
+    data.set(key, value);
+    this.size += data.size == size ? 0 : 1;
+    return this;
+  }
+  MapCache.prototype.clear = mapCacheClear;
+  MapCache.prototype["delete"] = mapCacheDelete;
+  MapCache.prototype.get = mapCacheGet;
+  MapCache.prototype.has = mapCacheHas;
+  MapCache.prototype.set = mapCacheSet;
+  function Stack(entries) {
+    var data = this.__data__ = new ListCache(entries);
+    this.size = data.size;
+  }
+  function stackClear() {
+    this.__data__ = new ListCache();
+    this.size = 0;
+  }
+  function stackDelete(key) {
+    var data = this.__data__, result = data["delete"](key);
+    this.size = data.size;
+    return result;
+  }
+  function stackGet(key) {
+    return this.__data__.get(key);
+  }
+  function stackHas(key) {
+    return this.__data__.has(key);
+  }
+  function stackSet(key, value) {
+    var data = this.__data__;
+    if (data instanceof ListCache) {
+      var pairs = data.__data__;
+      if (!Map2 || pairs.length < LARGE_ARRAY_SIZE - 1) {
+        pairs.push([key, value]);
+        this.size = ++data.size;
+        return this;
+      }
+      data = this.__data__ = new MapCache(pairs);
+    }
+    data.set(key, value);
+    this.size = data.size;
+    return this;
+  }
+  Stack.prototype.clear = stackClear;
+  Stack.prototype["delete"] = stackDelete;
+  Stack.prototype.get = stackGet;
+  Stack.prototype.has = stackHas;
+  Stack.prototype.set = stackSet;
+  function arrayLikeKeys(value, inherited) {
+    var isArr = isArray(value), isArg = !isArr && isArguments(value), isBuff = !isArr && !isArg && isBuffer(value), isType = !isArr && !isArg && !isBuff && isTypedArray(value), skipIndexes = isArr || isArg || isBuff || isType, result = skipIndexes ? baseTimes(value.length, String) : [], length = result.length;
+    for (var key in value) {
+      if (!(skipIndexes && // Safari 9 has enumerable `arguments.length` in strict mode.
+      (key == "length" || // Node.js 0.10 has enumerable non-index properties on buffers.
+      isBuff && (key == "offset" || key == "parent") || // PhantomJS 2 has enumerable non-index properties on typed arrays.
+      isType && (key == "buffer" || key == "byteLength" || key == "byteOffset") || // Skip index properties.
+      isIndex(key, length)))) {
+        result.push(key);
+      }
+    }
+    return result;
+  }
+  function assignMergeValue(object, key, value) {
+    if (value !== void 0 && !eq(object[key], value) || value === void 0 && !(key in object)) {
+      baseAssignValue(object, key, value);
+    }
+  }
+  function assignValue(object, key, value) {
+    var objValue = object[key];
+    if (!(hasOwnProperty.call(object, key) && eq(objValue, value)) || value === void 0 && !(key in object)) {
+      baseAssignValue(object, key, value);
+    }
+  }
+  function assocIndexOf(array, key) {
+    var length = array.length;
+    while (length--) {
+      if (eq(array[length][0], key)) {
+        return length;
+      }
+    }
+    return -1;
+  }
+  function baseAssignValue(object, key, value) {
+    if (key == "__proto__" && defineProperty) {
+      defineProperty(object, key, {
+        "configurable": true,
+        "enumerable": true,
+        "value": value,
+        "writable": true
+      });
+    } else {
+      object[key] = value;
+    }
+  }
+  var baseFor = createBaseFor();
+  function baseGetTag(value) {
+    if (value == null) {
+      return value === void 0 ? undefinedTag : nullTag;
+    }
+    return symToStringTag && symToStringTag in Object(value) ? getRawTag(value) : objectToString(value);
+  }
+  function baseIsArguments(value) {
+    return isObjectLike(value) && baseGetTag(value) == argsTag;
+  }
+  function baseIsNative(value) {
+    if (!isObject(value) || isMasked(value)) {
+      return false;
+    }
+    var pattern = isFunction2(value) ? reIsNative : reIsHostCtor;
+    return pattern.test(toSource(value));
+  }
+  function baseIsTypedArray(value) {
+    return isObjectLike(value) && isLength(value.length) && !!typedArrayTags[baseGetTag(value)];
+  }
+  function baseKeysIn(object) {
+    if (!isObject(object)) {
+      return nativeKeysIn(object);
+    }
+    var isProto = isPrototype(object), result = [];
+    for (var key in object) {
+      if (!(key == "constructor" && (isProto || !hasOwnProperty.call(object, key)))) {
+        result.push(key);
+      }
+    }
+    return result;
+  }
+  function baseMerge(object, source, srcIndex, customizer, stack) {
+    if (object === source) {
+      return;
+    }
+    baseFor(source, function(srcValue, key) {
+      stack || (stack = new Stack());
+      if (isObject(srcValue)) {
+        baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);
+      } else {
+        var newValue = customizer ? customizer(safeGet(object, key), srcValue, key + "", object, source, stack) : void 0;
+        if (newValue === void 0) {
+          newValue = srcValue;
+        }
+        assignMergeValue(object, key, newValue);
+      }
+    }, keysIn);
+  }
+  function baseMergeDeep(object, source, key, srcIndex, mergeFunc, customizer, stack) {
+    var objValue = safeGet(object, key), srcValue = safeGet(source, key), stacked = stack.get(srcValue);
+    if (stacked) {
+      assignMergeValue(object, key, stacked);
+      return;
+    }
+    var newValue = customizer ? customizer(objValue, srcValue, key + "", object, source, stack) : void 0;
+    var isCommon = newValue === void 0;
+    if (isCommon) {
+      var isArr = isArray(srcValue), isBuff = !isArr && isBuffer(srcValue), isTyped = !isArr && !isBuff && isTypedArray(srcValue);
+      newValue = srcValue;
+      if (isArr || isBuff || isTyped) {
+        if (isArray(objValue)) {
+          newValue = objValue;
+        } else if (isArrayLikeObject(objValue)) {
+          newValue = copyArray(objValue);
+        } else if (isBuff) {
+          isCommon = false;
+          newValue = cloneBuffer(srcValue);
+        } else if (isTyped) {
+          isCommon = false;
+          newValue = cloneTypedArray(srcValue);
+        } else {
+          newValue = [];
+        }
+      } else if (isPlainObject(srcValue) || isArguments(srcValue)) {
+        newValue = objValue;
+        if (isArguments(objValue)) {
+          newValue = toPlainObject(objValue);
+        } else if (!isObject(objValue) || isFunction2(objValue)) {
+          newValue = initCloneObject(srcValue);
+        }
+      } else {
+        isCommon = false;
+      }
+    }
+    if (isCommon) {
+      stack.set(srcValue, newValue);
+      mergeFunc(newValue, srcValue, srcIndex, customizer, stack);
+      stack["delete"](srcValue);
+    }
+    assignMergeValue(object, key, newValue);
+  }
+  function baseRest(func, start) {
+    return setToString(overRest(func, start, identity), func + "");
+  }
+  var baseSetToString = !defineProperty ? identity : function(func, string) {
+    return defineProperty(func, "toString", {
+      "configurable": true,
+      "enumerable": false,
+      "value": constant(string),
+      "writable": true
+    });
+  };
+  function cloneBuffer(buffer, isDeep) {
+    {
+      return buffer.slice();
+    }
+  }
+  function cloneArrayBuffer(arrayBuffer) {
+    var result = new arrayBuffer.constructor(arrayBuffer.byteLength);
+    new Uint8Array(result).set(new Uint8Array(arrayBuffer));
+    return result;
+  }
+  function cloneTypedArray(typedArray, isDeep) {
+    var buffer = cloneArrayBuffer(typedArray.buffer);
+    return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length);
+  }
+  function copyArray(source, array) {
+    var index = -1, length = source.length;
+    array || (array = Array(length));
+    while (++index < length) {
+      array[index] = source[index];
+    }
+    return array;
+  }
+  function copyObject(source, props, object, customizer) {
+    var isNew = !object;
+    object || (object = {});
+    var index = -1, length = props.length;
+    while (++index < length) {
+      var key = props[index];
+      var newValue = void 0;
+      if (newValue === void 0) {
+        newValue = source[key];
+      }
+      if (isNew) {
+        baseAssignValue(object, key, newValue);
+      } else {
+        assignValue(object, key, newValue);
+      }
+    }
+    return object;
+  }
+  function createAssigner(assigner) {
+    return baseRest(function(object, sources) {
+      var index = -1, length = sources.length, customizer = length > 1 ? sources[length - 1] : void 0, guard = length > 2 ? sources[2] : void 0;
+      customizer = assigner.length > 3 && typeof customizer == "function" ? (length--, customizer) : void 0;
+      if (guard && isIterateeCall(sources[0], sources[1], guard)) {
+        customizer = length < 3 ? void 0 : customizer;
+        length = 1;
+      }
+      object = Object(object);
+      while (++index < length) {
+        var source = sources[index];
+        if (source) {
+          assigner(object, source, index, customizer);
+        }
+      }
+      return object;
+    });
+  }
+  function createBaseFor(fromRight) {
+    return function(object, iteratee, keysFunc) {
+      var index = -1, iterable = Object(object), props = keysFunc(object), length = props.length;
+      while (length--) {
+        var key = props[++index];
+        if (iteratee(iterable[key], key, iterable) === false) {
+          break;
+        }
+      }
+      return object;
+    };
+  }
+  function getMapData(map, key) {
+    var data = map.__data__;
+    return isKeyable(key) ? data[typeof key == "string" ? "string" : "hash"] : data.map;
+  }
+  function getNative(object, key) {
+    var value = getValue(object, key);
+    return baseIsNative(value) ? value : void 0;
+  }
+  function getRawTag(value) {
+    var isOwn = hasOwnProperty.call(value, symToStringTag), tag = value[symToStringTag];
+    try {
+      value[symToStringTag] = void 0;
+      var unmasked = true;
+    } catch (e2) {
+    }
+    var result = nativeObjectToString.call(value);
+    if (unmasked) {
+      if (isOwn) {
+        value[symToStringTag] = tag;
+      } else {
+        delete value[symToStringTag];
+      }
+    }
+    return result;
+  }
+  function initCloneObject(object) {
+    return typeof object.constructor == "function" && !isPrototype(object) ? baseCreate(getPrototype(object)) : {};
+  }
+  function isIndex(value, length) {
+    var type = typeof value;
+    length = length == null ? MAX_SAFE_INTEGER : length;
+    return !!length && (type == "number" || type != "symbol" && reIsUint.test(value)) && (value > -1 && value % 1 == 0 && value < length);
+  }
+  function isIterateeCall(value, index, object) {
+    if (!isObject(object)) {
+      return false;
+    }
+    var type = typeof index;
+    if (type == "number" ? isArrayLike(object) && isIndex(index, object.length) : type == "string" && index in object) {
+      return eq(object[index], value);
+    }
+    return false;
+  }
+  function isKeyable(value) {
+    var type = typeof value;
+    return type == "string" || type == "number" || type == "symbol" || type == "boolean" ? value !== "__proto__" : value === null;
+  }
+  function isMasked(func) {
+    return !!maskSrcKey && maskSrcKey in func;
+  }
+  function isPrototype(value) {
+    var Ctor = value && value.constructor, proto = typeof Ctor == "function" && Ctor.prototype || objectProto;
+    return value === proto;
+  }
+  function nativeKeysIn(object) {
+    var result = [];
+    if (object != null) {
+      for (var key in Object(object)) {
+        result.push(key);
+      }
+    }
+    return result;
+  }
+  function objectToString(value) {
+    return nativeObjectToString.call(value);
+  }
+  function overRest(func, start, transform) {
+    start = nativeMax(start === void 0 ? func.length - 1 : start, 0);
+    return function() {
+      var args = arguments, index = -1, length = nativeMax(args.length - start, 0), array = Array(length);
+      while (++index < length) {
+        array[index] = args[start + index];
+      }
+      index = -1;
+      var otherArgs = Array(start + 1);
+      while (++index < start) {
+        otherArgs[index] = args[index];
+      }
+      otherArgs[start] = transform(array);
+      return apply(func, this, otherArgs);
+    };
+  }
+  function safeGet(object, key) {
+    if (key === "constructor" && typeof object[key] === "function") {
+      return;
+    }
+    if (key == "__proto__") {
+      return;
+    }
+    return object[key];
+  }
+  var setToString = shortOut(baseSetToString);
+  function shortOut(func) {
+    var count = 0, lastCalled = 0;
+    return function() {
+      var stamp = nativeNow(), remaining = HOT_SPAN - (stamp - lastCalled);
+      lastCalled = stamp;
+      if (remaining > 0) {
+        if (++count >= HOT_COUNT) {
+          return arguments[0];
+        }
+      } else {
+        count = 0;
+      }
+      return func.apply(void 0, arguments);
+    };
+  }
+  function toSource(func) {
+    if (func != null) {
+      try {
+        return funcToString.call(func);
+      } catch (e2) {
+      }
+      try {
+        return func + "";
+      } catch (e2) {
+      }
+    }
+    return "";
+  }
+  function eq(value, other) {
+    return value === other || value !== value && other !== other;
+  }
+  var isArguments = baseIsArguments(/* @__PURE__ */ function() {
+    return arguments;
+  }()) ? baseIsArguments : function(value) {
+    return isObjectLike(value) && hasOwnProperty.call(value, "callee") && !propertyIsEnumerable.call(value, "callee");
+  };
+  var isArray = Array.isArray;
+  function isArrayLike(value) {
+    return value != null && isLength(value.length) && !isFunction2(value);
+  }
+  function isArrayLikeObject(value) {
+    return isObjectLike(value) && isArrayLike(value);
+  }
+  var isBuffer = nativeIsBuffer || stubFalse;
+  function isFunction2(value) {
+    if (!isObject(value)) {
+      return false;
+    }
+    var tag = baseGetTag(value);
+    return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;
+  }
+  function isLength(value) {
+    return typeof value == "number" && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
+  }
+  function isObject(value) {
+    var type = typeof value;
+    return value != null && (type == "object" || type == "function");
+  }
+  function isObjectLike(value) {
+    return value != null && typeof value == "object";
+  }
+  function isPlainObject(value) {
+    if (!isObjectLike(value) || baseGetTag(value) != objectTag) {
+      return false;
+    }
+    var proto = getPrototype(value);
+    if (proto === null) {
+      return true;
+    }
+    var Ctor = hasOwnProperty.call(proto, "constructor") && proto.constructor;
+    return typeof Ctor == "function" && Ctor instanceof Ctor && funcToString.call(Ctor) == objectCtorString;
+  }
+  var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;
+  function toPlainObject(value) {
+    return copyObject(value, keysIn(value));
+  }
+  function keysIn(object) {
+    return isArrayLike(object) ? arrayLikeKeys(object) : baseKeysIn(object);
+  }
+  var merge2 = createAssigner(function(object, source, srcIndex) {
+    baseMerge(object, source, srcIndex);
+  });
+  function constant(value) {
+    return function() {
+      return value;
+    };
+  }
+  function identity(value) {
+    return value;
+  }
+  function stubFalse() {
+    return false;
+  }
+  module.exports = merge2;
+})(lodash_merge, lodash_merge.exports);
+var lodash_mergeExports = lodash_merge.exports;
+const merge = /* @__PURE__ */ getDefaultExportFromCjs(lodash_mergeExports);
+const devToolsTheme = merge({}, defaultTheme, {
+  // Color system optimized for dark DevTools
+  colors: {
+    // Background colors
+    background: {
+      tint1: "#1E1E1E",
+      // Main panel background
+      tint2: "#2A2A2A",
+      // Card/section backgrounds  
+      overlay: "rgba(0,0,0,0.9)"
+      // Modal overlays
+    },
+    // Border colors
+    border: {
+      default: "#333333",
+      // Primary borders
+      muted: "#2A2A2A"
+      // Subtle borders
+    },
+    // Text colors
+    text: {
+      default: "#FFFFFF",
+      // Primary text
+      muted: "#CCCCCC",
+      // Secondary text
+      dark: "#888888"
+      // Tertiary text
+    },
+    // Brand colors (blue-green palette)
+    palette: {
+      primary: {
+        base: "#22577a",
+        // Lapis Lazuli
+        dark: "#1a3d4d",
+        // Darker shade
+        light: "#38a3a5"
+        // Verdigris for hover
+      },
+      // Status colors
+      success: {
+        base: "#57cc99",
+        // Emerald
+        dark: "#38a3a5",
+        // Verdigris
+        light: "#80ed99"
+        // Light green
+      },
+      warning: {
+        base: "#F39C12",
+        // Orange for warning states  
+        dark: "#D68910",
+        light: "#F1C40F"
+      },
+      danger: {
+        base: "#E74C3C",
+        // Red for error states
+        dark: "#C0392B",
+        light: "#EC7063"
+      },
+      neutral: {
+        base: "#95A5A6",
+        // Gray for neutral states
+        dark: "#7F8C8D",
+        light: "#BDC3C7"
+      }
+    },
+    // Intent colors (Evergreen's semantic colors)
+    intent: {
+      success: "#57cc99",
+      // Emerald
+      warning: "#F39C12",
+      danger: "#E74C3C",
+      none: "#95A5A6"
+    }
+  },
+  // Typography system
+  typography: {
+    fontFamilies: {
+      display: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      ui: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+      mono: 'Monaco, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace'
+    },
+    fontSizes: {
+      caption: 11,
+      // Small captions
+      body: 13,
+      // Body text (DevTools standard)
+      heading: 16,
+      // Section headings
+      title: 20
+      // Panel title
+    },
+    fontWeights: {
+      light: 300,
+      normal: 400,
+      medium: 500,
+      semibold: 600,
+      bold: 700
+    }
+  },
+  // Component-specific overrides
+  components: {
+    // Button component customization
+    Button: {
+      baseStyle: {
+        borderRadius: "6px",
+        fontWeight: 500,
+        transition: "all 0.2s ease",
+        cursor: "pointer",
+        fontFamily: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
+      },
+      appearances: {
+        // Primary button (Debug All, Trace All)
+        primary: {
+          backgroundColor: "#22577a",
+          color: "#FFFFFF",
+          border: "none",
+          _hover: {
+            backgroundColor: "#38a3a5",
+            transform: "translateY(-1px)",
+            boxShadow: "0 2px 8px rgba(34, 87, 122, 0.3)"
+          },
+          _active: {
+            backgroundColor: "#1a3d4d",
+            transform: "translateY(0)",
+            boxShadow: "0 1px 4px rgba(34, 87, 122, 0.3)"
+          },
+          _disabled: {
+            backgroundColor: "#555555",
+            color: "#888888",
+            transform: "none",
+            boxShadow: "none"
+          }
+        },
+        // Minimal button (secondary actions)
+        minimal: {
+          backgroundColor: "transparent",
+          color: "#CCCCCC",
+          border: "1px solid #333333",
+          _hover: {
+            backgroundColor: "#2A2A2A",
+            borderColor: "#38a3a5",
+            color: "#FFFFFF"
+          },
+          _active: {
+            backgroundColor: "#1E1E1E",
+            borderColor: "#22577a"
+          }
+        },
+        // Danger button (Reset, destructive actions)
+        default: {
+          backgroundColor: "#E74C3C",
+          color: "#FFFFFF",
+          border: "none",
+          _hover: {
+            backgroundColor: "#EC7063",
+            transform: "translateY(-1px)"
+          },
+          _active: {
+            backgroundColor: "#C0392B",
+            transform: "translateY(0)"
+          }
+        }
+      },
+      sizes: {
+        small: {
+          height: 28,
+          paddingX: 12,
+          fontSize: 12
+        },
+        medium: {
+          height: 32,
+          paddingX: 16,
+          fontSize: 13
+        },
+        large: {
+          height: 36,
+          paddingX: 20,
+          fontSize: 14
+        }
+      }
+    },
+    // Switch component (for component toggles)
+    Switch: {
+      baseStyle: {
+        backgroundColor: "#444444"
+      },
+      appearances: {
+        default: {
+          backgroundColor: "#444444",
+          _checked: {
+            backgroundColor: "#22577a"
+          },
+          _hover: {
+            backgroundColor: "#555555"
+          },
+          _checkedHover: {
+            backgroundColor: "#38a3a5"
+          }
+        }
+      }
+    },
+    // Pane component (containers, panels)
+    Pane: {
+      baseStyle: {
+        backgroundColor: "#1E1E1E",
+        border: "1px solid #333333",
+        borderRadius: "8px"
+      }
+    },
+    // Card component (content cards)
+    Card: {
+      baseStyle: {
+        backgroundColor: "#2A2A2A",
+        border: "1px solid #333333",
+        borderRadius: "8px",
+        boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)"
+      }
+    },
+    // Text components
+    Text: {
+      baseStyle: {
+        color: "#FFFFFF",
+        fontFamily: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
+      },
+      appearances: {
+        default: {
+          color: "#FFFFFF"
+        },
+        muted: {
+          color: "#CCCCCC"
+        },
+        disabled: {
+          color: "#888888"
+        }
+      }
+    },
+    // Heading components
+    Heading: {
+      baseStyle: {
+        color: "#38a3a5",
+        fontFamily: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+        fontWeight: 600
+      }
+    },
+    // Badge component (for log counts)
+    Badge: {
+      appearances: {
+        default: {
+          backgroundColor: "#E74C3C",
+          color: "#FFFFFF"
+        }
+      }
+    }
+  }
+});
+console.log("🎛️ JSG Logger DevTools Panel - Evergreen UI Edition");
+console.log("[JSG-DEVTOOLS] Loading from source with hot reload enabled", {
+  timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+  version: "v2.0",
+  framework: "Evergreen UI + Preact",
+  loadedFrom: "devtools/src/panel-entry.jsx"
+});
+let panelInstance = null;
+let isInitialized = false;
+let closeHandler = null;
+function initializePanel() {
+  if (isInitialized) {
+    console.log("[JSG-DEVTOOLS] Panel already initialized");
+    return panelInstance;
+  }
+  console.log("[JSG-DEVTOOLS] Initializing DevTools panel");
+  console.log("[JSG-DEVTOOLS] devToolsTheme:", devToolsTheme);
+  console.log("[JSG-DEVTOOLS] theme.colors exists?", !!(devToolsTheme == null ? void 0 : devToolsTheme.colors));
+  try {
+    if (!window.JSG_Logger) {
+      console.warn("[JSG-DEVTOOLS] JSG Logger not found on window. Make sure logger is initialized.");
+      return null;
+    }
+    const panelContainer = document.createElement("div");
+    panelContainer.id = "jsg-devtools-panel";
+    panelContainer.style.cssText = `
+            position: fixed;
+            top: 0;
+            left: 0;
+            z-index: 999999;
+            pointer-events: none;
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+        `;
+    if (!document.getElementById("jsg-devtools-body-styles")) {
+      const bodyStyles = document.createElement("style");
+      bodyStyles.id = "jsg-devtools-body-styles";
+      bodyStyles.textContent = `
+                body.jsg-devtools-panel-open {
+                    margin-left: 380px !important;
+                    transition: margin-left 0.3s ease-out !important;
+                }
+                
+                body.jsg-devtools-panel-closing {
+                    margin-left: 0 !important;
+                    transition: margin-left 0.3s ease-in !important;
+                }
+            `;
+      document.head.appendChild(bodyStyles);
+    }
+    document.body.appendChild(panelContainer);
+    nn(
+      /* @__PURE__ */ u(ThemeProvider, { value: devToolsTheme, children: /* @__PURE__ */ u(
+        DevToolsPanel,
+        {
+          loggerControls: window.JSG_Logger,
+          onUnmount: (handler) => {
+            closeHandler = handler;
+          }
+        }
+      ) }),
+      panelContainer
+    );
+    panelInstance = {
+      container: panelContainer,
+      destroy: () => destroyPanel()
+    };
+    isInitialized = true;
+    console.log("[JSG-DEVTOOLS] Panel initialized successfully");
+    return panelInstance;
+  } catch (error) {
+    console.error("[JSG-DEVTOOLS] Failed to initialize panel:", error);
+    return null;
+  }
+}
+function destroyPanel() {
+  if (panelInstance == null ? void 0 : panelInstance.container) {
+    if (closeHandler) {
+      closeHandler();
+      setTimeout(() => {
+        if ((panelInstance == null ? void 0 : panelInstance.container) && document.body.contains(panelInstance.container)) {
+          document.body.removeChild(panelInstance.container);
+        }
+        panelInstance = null;
+        isInitialized = false;
+        closeHandler = null;
+        console.log("[JSG-DEVTOOLS] Panel destroyed with animation");
+      }, 350);
+    } else {
+      document.body.removeChild(panelInstance.container);
+      panelInstance = null;
+      isInitialized = false;
+      closeHandler = null;
+      console.log("[JSG-DEVTOOLS] Panel destroyed");
+    }
+  }
+}
+function togglePanel() {
+  console.log("[JSG-DEVTOOLS] Panel is always visible when loaded. Use disableDevPanel() to remove.");
+}
+if (typeof window !== "undefined") {
+  window.JSG_DevTools = {
+    initialize: initializePanel,
+    destroy: destroyPanel,
+    toggle: togglePanel
+  };
+}
+export {
+  initializePanel,
+  togglePanel
+};
+//# sourceMappingURL=panel-entry.js.map