@contember/react-devbar 1.3.0-alpha.14

package/dist/assets/index.css

@@ -0,0 +1,377 @@
+.cui-devBar {
+    align-items: center;
+    bottom: 0;
+    display: flex;
+    flex-direction: column;
+    position: fixed;
+    z-index: 1000;
+    left: 0;
+    right: 0;
+    opacity: 1;
+    padding: 1rem;
+    transition-property: opacity, transform;
+    transition-duration: 200ms;
+    transition-timing-function: ease-in-out;
+}
+
+.cui-devBar-content,
+.cui-devBar-panel-content {
+    background: #eee;
+    color: #002251;
+}
+
+.cui-devBar-content {
+    align-self: center;
+    align-items: center;
+    border-radius: 1rem;
+    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+    display: flex;
+    gap: 1rem;
+    padding: 0.5rem;
+    margin: 0 auto;
+}
+
+.cui-devBar-close,
+.cui-devBar-trigger-label,
+.cui-devBar-brand {
+    align-items: center;
+    height: 2rem;
+    border-radius: 0.5rem;
+    justify-content: center;
+    max-height: 2rem;
+    min-height: 2rem;
+    white-space: nowrap;
+}
+
+.cui-devBar-close {
+    background: transparent;
+    cursor: pointer;
+    display: flex;
+    max-width: 2rem;
+    width: 2rem;
+    order: 999;
+}
+
+.cui-devBar-brand {
+    align-items: center;
+    display: flex;
+    gap: 1rem;
+    text-align: right;
+}
+
+.cui-devBar-brand  svg {
+    max-height: 2rem;
+}
+
+.cui-devBar-panels {
+    display: flex;
+    gap: 1rem;
+}
+
+.cui-devBar-trigger {
+    display: flex;
+}
+
+.cui-devBar-trigger-label {
+    align-items: center;
+    color: inherit;
+    cursor: pointer;
+    display: inline-flex;
+    font-weight: normal;
+    gap: 0.3rem;
+    padding: 0 0.2rem;
+}
+
+.cui-devBar-trigger-label:hover {
+    background-color: #e0e0e0;
+}
+
+.cui-devBar-panel {
+    justify-content: center;
+    display: flex;
+    flex-direction: row;
+    gap: 1rem;
+    left: 0;
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    padding: 2rem;
+    transform: translateY(-1rem);
+}
+
+.cui-devBar-trigger:not([data-expanded]) > .cui-devBar-panel {
+    display: none;
+}
+
+.cui-devBar-panel-content {
+    background: #fff;
+    border: 1px solid #ccc;
+    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+    border-radius: 0.5rem;
+    display: flex;
+    min-width: min(20rem, 100%);
+    max-width: 100%;
+    flex-direction: column;
+    flex-shrink: 1;
+}
+
+.cui-devBar-panel-content h2 {
+    font-weight: bold;
+    margin-bottom: 0;
+    padding: 0.4rem 1rem;
+    border-radius: 0.5rem 0.5rem 0 0;
+    background: #f8f8f8;
+}
+
+@media screen and (min-width: 768px) {
+    .cui-devBar-trigger {
+        position: relative;
+    }
+
+    .cui-devBar-panel-content {
+        min-width: unset;
+        max-width: unset;
+    }
+
+    .cui-devBar-panel-body {
+        min-width: 20rem;
+    }
+}
+
+.cui-devBar-panel-body {
+    border-top: 1px solid #ccc;
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    padding: 1rem;
+}
+
+.cui-devBar:not([data-expanded]) {
+    transform: translateY(2rem);
+    opacity: 0;
+    max-width: 5rem;
+    margin: auto;
+}
+
+.cui-devBar:not([data-expanded]):hover,
+.cui-devBar:not([data-expanded]):focus-within {
+    transform: unset;
+    opacity: unset;
+}
+
+[id^="dev-bar-panel"]:not([data-expanded]) > * {
+    display: none;
+}
+
+.cui-devBar-panel .cui-table-wrapper {
+    overflow: auto;
+}
+
+.cui-devError {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    width: 100vw;
+    height: 100vh;
+    z-index: 99;
+    display: flex;
+    justify-content: center;
+    align-items: flex-start;
+    background: rgba(212, 212, 212, 0.66);
+    font-family: Poppins, Roboto, sans-serif;
+}
+
+.cui-devError-in {
+    z-index: 100;
+    width: 100%;
+    height: 100%;
+    color: #333;
+    background: #222;
+    box-shadow: 3px 3px 10px rgba(50, 50, 50, 0.5);
+    display: flex;
+    flex-direction: column;
+    overflow: auto;
+}
+
+.cui-devError-header {
+    background: #CD1818;
+    color: #FFF;
+    padding: 0.5em 1em;
+}
+
+.cui-devError-errorMessage,
+.cui-devError-errorName,
+.cui-devError-errorDetails {
+    margin: 0;
+    flex: 0 0 auto;
+    font-weight: 300;
+    white-space: pre-wrap;
+    overflow-wrap: break-word;
+    line-height: 130%;
+}
+
+.cui-devError-errorMessage {
+    font-family: monospace;
+    margin-top: 0.5em;
+    font-size: 1.7em;
+}
+
+.cui-devError-errorDetails {
+    font-family: monospace;
+    margin-top: 0.5em;
+    font-size: 1em;
+    white-space: pre;
+    overflow-x: scroll;
+}
+
+.cui-devError-causeLink {
+    color: #FFCC00;
+    text-decoration: underline;
+}
+
+.cui-devError-stack {
+    flex: 1 1 auto;
+}
+
+.cui-devError-stack-dump {
+    color: #fff;
+    margin-top: 1em;
+    padding: 1em;
+    white-space: pre-wrap;
+}
+
+.cui-devError-bar {
+    padding: 0.2em 0.2em 0.2em 1em;
+    background: #ac1616;
+    color: #eee;
+    display: flex;
+}
+
+.cui-devError-causedBy {
+    padding: 0.2em 0.2em 0.2em 1em;
+    background: #FFCC00;
+    color: #000;
+    display: flex;
+}
+
+.cui-devError-actions {
+    margin-left: auto;
+    display: flex;
+}
+
+.cui-devError-actions .cui-button {
+    color: #fff;
+    border-color: #cbcbcb;
+}
+
+.cui-devError-actions .cui-button:hover {
+    color: #fff;
+}
+
+.cui-devError-close {
+    margin-left: 1em;
+}
+
+.cui-devError-close .cui-button {
+    border-color: transparent;
+}
+
+.cui-devError-switcher {
+    display: flex;
+    align-items: center;
+    margin-left: 2em;
+}
+
+.cui-devError-switcherButtons {
+    display: flex;
+    align-items: center;
+    gap: 0.5em;
+}
+
+.cui-devError-closeButton,
+.cui-devError-switcherButton {
+    border: 1px solid #cbcbcb;
+    border-radius: 0.2em;
+    padding: 0.2em 0.5em;
+}
+
+.cui-devError-errorCount {
+    margin: 0;
+    margin-right: 0.5em;
+}
+
+.cui-devError-stackFrame {
+    font-family: monospace;
+}
+
+.cui-devError-stackFrame:last-child {
+    border-bottom: 1px solid #666;
+}
+
+.cui-devError-stackFrameHeader {
+    display: flex;
+    padding: 0.5em 1em;
+    background: #333;
+    color: #fff;
+    border-bottom: 1px solid #666;
+    border-top: 1px solid #666;
+}
+
+.cui-devError-stackFrameSource {
+    margin-left: 0.2em;
+}
+
+.cui-devError-stackFrameCallee {
+    margin-left: 1em;
+    color: #a4ffa4;
+}
+
+.cui-devError-stackFrameCode {
+    background: #222;
+    color: #D5D5D5;
+}
+
+.cui-devError-stackFrameLine {
+    display: flex;
+}
+
+.cui-devError-stackFrameLine.is-active {
+    color: #fff;
+    background: #CD1818;
+}
+
+.cui-devError-stackFrameLine.is-active .cui-devError-stackFrameLineNumber {
+    color: #fff;
+}
+
+.cui-devError-stackFrameLineNumber {
+    color: #888;
+    flex: 0 0 50px;
+    text-align: right;
+    padding: 0.2em;
+}
+
+.cui-devError-stackFrameLineCode {
+    padding: 0.2em 1em;
+    white-space: pre-wrap;
+    tab-size: 4;
+}
+
+:where(.cui-devErrorBadge) {
+	position: fixed;
+	bottom: 20px;
+	left: 20px;
+}
+
+:where(.cui-devErrorBadge-button) {
+	display: block;
+	background: #CD1818;
+	color: #fff;
+	font-weight: 600;
+	box-shadow: 3px 3px 7px rgba(50, 50, 50, 0.5);
+	border-radius: 10px;
+	padding: 1em 2em;
+	cursor: pointer;
+}

package/dist/development/errorHandling.cjs

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const ReactDOM = require("react-dom");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const ReactDOM__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactDOM);
+const getErrorContainer = () => {
+  const errorElementId = "__contember__dev__error__container__element";
+  let errorContainer = document.getElementById(errorElementId);
+  if (errorContainer) {
+    ReactDOM__namespace.unmountComponentAtNode(errorContainer);
+  } else {
+    errorContainer = document.createElement("div");
+    errorContainer.id = errorElementId;
+    document.body.appendChild(errorContainer);
+  }
+  return errorContainer;
+};
+const prodErrorHandler = (renderer) => {
+  const renderError = () => {
+    renderer(getErrorContainer(), /* @__PURE__ */ jsxRuntime.jsx("h1", { children: "Fatal error" }), () => {
+    });
+  };
+  window.addEventListener("error", renderError);
+  window.addEventListener("unhandledrejection", renderError);
+  return async (cb) => {
+    try {
+      await cb((e) => {
+        console.warn(e);
+      });
+    } catch (e) {
+      console.error(e);
+      renderError();
+    }
+  };
+};
+const createErrorHandler = (renderer) => {
+  {
+    return prodErrorHandler(renderer);
+  }
+};
+exports.createErrorHandler = createErrorHandler;
+//# sourceMappingURL=errorHandling.cjs.map

package/dist/development/errorHandling.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"errorHandling.cjs","sources":["../../src/errorHandling.tsx"],"sourcesContent":["import * as ReactDOM from 'react-dom'\nimport { Buffer } from 'buffer'\nimport { DevErrorManager, ErrorBus } from './DevErrorManager'\nimport { ReactElement } from 'react'\n\nexport type ErrorReactRenderer = (domElement: Element, reactElement: ReactElement, onRecoverableError: (e: any) => void) => void\n\nconst getErrorContainer = () => {\n\tconst errorElementId = '__contember__dev__error__container__element'\n\tlet errorContainer = document.getElementById(errorElementId)\n\n\tif (errorContainer) {\n\t\t// eslint-disable-next-line react/no-deprecated\n\t\tReactDOM.unmountComponentAtNode(errorContainer)\n\n\t} else {\n\t\terrorContainer = document.createElement('div')\n\t\terrorContainer.id = errorElementId\n\t\tdocument.body.appendChild(errorContainer)\n\t}\n\n\treturn errorContainer\n}\n\nconst devErrorHandler = (renderer: ErrorReactRenderer): TryRun => {\n\tconst errorBus = new ErrorBus()\n\n\t;(window as any).Buffer = Buffer\n\twindow.addEventListener('error', e => {\n\t\tif (e.message.startsWith('ResizeObserver')) {\n\t\t\t// Apparently, this can be ignored: https://stackoverflow.com/questions/49384120/resizeobserver-loop-limit-exceeded\n\t\t\treturn\n\t\t}\n\t\terrorBus.handleError('Unhandled error', e.error)\n\t})\n\n\twindow.addEventListener('unhandledrejection', e => errorBus.handleError('Unhandled promise rejection', e.reason))\n\n\tconst origOnError = console.error\n\tconsole.error = (...args) => {\n\t\torigOnError(...args)\n\t\tfor (const arg of args) {\n\t\t\tif (arg instanceof Error) {\n\t\t\t\terrorBus.handleError('Logged error', arg)\n\t\t\t}\n\t\t}\n\t}\n\trenderer(getErrorContainer(), <DevErrorManager bus={errorBus} />, () => {})\n\n\treturn async cb => {\n\t\ttry {\n\t\t\tawait cb(e => errorBus.handleError('Recoverable React error', e))\n\t\t} catch (e) {\n\t\t\terrorBus.handleError('Entrypoint crash', e)\n\t\t}\n\t}\n}\n\ntype TryRun = <T>(cb: (onRecoverableError: (e: any) => void) => T | Promise<T>) => void\nconst prodErrorHandler = (renderer: ErrorReactRenderer): TryRun => {\n\tconst renderError = () => {\n\t\trenderer(getErrorContainer(), <h1>Fatal error</h1>, () => {})\n\t}\n\n\twindow.addEventListener('error', renderError)\n\twindow.addEventListener('unhandledrejection', renderError)\n\n\treturn async cb => {\n\t\ttry {\n\t\t\tawait cb(e => {\n\t\t\t\tconsole.warn(e)\n\t\t\t})\n\t\t} catch (e) {\n\t\t\tconsole.error(e)\n\t\t\trenderError()\n\t\t}\n\t}\n}\n\n\nexport const createErrorHandler = (renderer: ErrorReactRenderer) => {\n\tif (import.meta.env.DEV) {\n\t\treturn devErrorHandler(renderer)\n\t} else {\n\t\treturn prodErrorHandler(renderer)\n\t}\n}\n"],"names":["ReactDOM","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,oBAAoB,MAAM;AAC/B,QAAM,iBAAiB;AACnB,MAAA,iBAAiB,SAAS,eAAe,cAAc;AAE3D,MAAI,gBAAgB;AAEnBA,wBAAS,uBAAuB,cAAc;AAAA,EAAA,OAExC;AACW,qBAAA,SAAS,cAAc,KAAK;AAC7C,mBAAe,KAAK;AACX,aAAA,KAAK,YAAY,cAAc;AAAA,EACzC;AAEO,SAAA;AACR;AAqCA,MAAM,mBAAmB,CAAC,aAAyC;AAClE,QAAM,cAAc,MAAM;AAChB,aAAA,qBAAsBC,+BAAA,MAAG,EAAA,UAAA,cAAW,CAAA,GAAO,MAAM;AAAA,IAAA,CAAE;AAAA,EAAA;AAGtD,SAAA,iBAAiB,SAAS,WAAW;AACrC,SAAA,iBAAiB,sBAAsB,WAAW;AAEzD,SAAO,OAAM,OAAM;AACd,QAAA;AACG,YAAA,GAAG,CAAK,MAAA;AACb,gBAAQ,KAAK,CAAC;AAAA,MAAA,CACd;AAAA,aACO,GAAG;AACX,cAAQ,MAAM,CAAC;AACH;IACb;AAAA,EAAA;AAEF;AAGa,MAAA,qBAAqB,CAAC,aAAiC;AAG5D;AACN,WAAO,iBAAiB,QAAQ;AAAA,EACjC;AACD;;"}

package/dist/development/errorHandling.js

@@ -0,0 +1,41 @@
+import { jsx } from "react/jsx-runtime";
+import * as ReactDOM from "react-dom";
+const getErrorContainer = () => {
+  const errorElementId = "__contember__dev__error__container__element";
+  let errorContainer = document.getElementById(errorElementId);
+  if (errorContainer) {
+    ReactDOM.unmountComponentAtNode(errorContainer);
+  } else {
+    errorContainer = document.createElement("div");
+    errorContainer.id = errorElementId;
+    document.body.appendChild(errorContainer);
+  }
+  return errorContainer;
+};
+const prodErrorHandler = (renderer) => {
+  const renderError = () => {
+    renderer(getErrorContainer(), /* @__PURE__ */ jsx("h1", { children: "Fatal error" }), () => {
+    });
+  };
+  window.addEventListener("error", renderError);
+  window.addEventListener("unhandledrejection", renderError);
+  return async (cb) => {
+    try {
+      await cb((e) => {
+        console.warn(e);
+      });
+    } catch (e) {
+      console.error(e);
+      renderError();
+    }
+  };
+};
+const createErrorHandler = (renderer) => {
+  {
+    return prodErrorHandler(renderer);
+  }
+};
+export {
+  createErrorHandler
+};
+//# sourceMappingURL=errorHandling.js.map

package/dist/development/errorHandling.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"errorHandling.js","sources":["../../src/errorHandling.tsx"],"sourcesContent":["import * as ReactDOM from 'react-dom'\nimport { Buffer } from 'buffer'\nimport { DevErrorManager, ErrorBus } from './DevErrorManager'\nimport { ReactElement } from 'react'\n\nexport type ErrorReactRenderer = (domElement: Element, reactElement: ReactElement, onRecoverableError: (e: any) => void) => void\n\nconst getErrorContainer = () => {\n\tconst errorElementId = '__contember__dev__error__container__element'\n\tlet errorContainer = document.getElementById(errorElementId)\n\n\tif (errorContainer) {\n\t\t// eslint-disable-next-line react/no-deprecated\n\t\tReactDOM.unmountComponentAtNode(errorContainer)\n\n\t} else {\n\t\terrorContainer = document.createElement('div')\n\t\terrorContainer.id = errorElementId\n\t\tdocument.body.appendChild(errorContainer)\n\t}\n\n\treturn errorContainer\n}\n\nconst devErrorHandler = (renderer: ErrorReactRenderer): TryRun => {\n\tconst errorBus = new ErrorBus()\n\n\t;(window as any).Buffer = Buffer\n\twindow.addEventListener('error', e => {\n\t\tif (e.message.startsWith('ResizeObserver')) {\n\t\t\t// Apparently, this can be ignored: https://stackoverflow.com/questions/49384120/resizeobserver-loop-limit-exceeded\n\t\t\treturn\n\t\t}\n\t\terrorBus.handleError('Unhandled error', e.error)\n\t})\n\n\twindow.addEventListener('unhandledrejection', e => errorBus.handleError('Unhandled promise rejection', e.reason))\n\n\tconst origOnError = console.error\n\tconsole.error = (...args) => {\n\t\torigOnError(...args)\n\t\tfor (const arg of args) {\n\t\t\tif (arg instanceof Error) {\n\t\t\t\terrorBus.handleError('Logged error', arg)\n\t\t\t}\n\t\t}\n\t}\n\trenderer(getErrorContainer(), <DevErrorManager bus={errorBus} />, () => {})\n\n\treturn async cb => {\n\t\ttry {\n\t\t\tawait cb(e => errorBus.handleError('Recoverable React error', e))\n\t\t} catch (e) {\n\t\t\terrorBus.handleError('Entrypoint crash', e)\n\t\t}\n\t}\n}\n\ntype TryRun = <T>(cb: (onRecoverableError: (e: any) => void) => T | Promise<T>) => void\nconst prodErrorHandler = (renderer: ErrorReactRenderer): TryRun => {\n\tconst renderError = () => {\n\t\trenderer(getErrorContainer(), <h1>Fatal error</h1>, () => {})\n\t}\n\n\twindow.addEventListener('error', renderError)\n\twindow.addEventListener('unhandledrejection', renderError)\n\n\treturn async cb => {\n\t\ttry {\n\t\t\tawait cb(e => {\n\t\t\t\tconsole.warn(e)\n\t\t\t})\n\t\t} catch (e) {\n\t\t\tconsole.error(e)\n\t\t\trenderError()\n\t\t}\n\t}\n}\n\n\nexport const createErrorHandler = (renderer: ErrorReactRenderer) => {\n\tif (import.meta.env.DEV) {\n\t\treturn devErrorHandler(renderer)\n\t} else {\n\t\treturn prodErrorHandler(renderer)\n\t}\n}\n"],"names":[],"mappings":";;AAOA,MAAM,oBAAoB,MAAM;AAC/B,QAAM,iBAAiB;AACnB,MAAA,iBAAiB,SAAS,eAAe,cAAc;AAE3D,MAAI,gBAAgB;AAEnB,aAAS,uBAAuB,cAAc;AAAA,EAAA,OAExC;AACW,qBAAA,SAAS,cAAc,KAAK;AAC7C,mBAAe,KAAK;AACX,aAAA,KAAK,YAAY,cAAc;AAAA,EACzC;AAEO,SAAA;AACR;AAqCA,MAAM,mBAAmB,CAAC,aAAyC;AAClE,QAAM,cAAc,MAAM;AAChB,aAAA,qBAAsB,oBAAA,MAAG,EAAA,UAAA,cAAW,CAAA,GAAO,MAAM;AAAA,IAAA,CAAE;AAAA,EAAA;AAGtD,SAAA,iBAAiB,SAAS,WAAW;AACrC,SAAA,iBAAiB,sBAAsB,WAAW;AAEzD,SAAO,OAAM,OAAM;AACd,QAAA;AACG,YAAA,GAAG,CAAK,MAAA;AACb,gBAAQ,KAAK,CAAC;AAAA,MAAA,CACd;AAAA,aACO,GAAG;AACX,cAAQ,MAAM,CAAC;AACH;IACb;AAAA,EAAA;AAEF;AAGa,MAAA,qBAAqB,CAAC,aAAiC;AAG5D;AACN,WAAO,iBAAiB,QAAQ;AAAA,EACjC;AACD;"}

package/dist/development/hooks/useParsedStacktrace.cjs

@@ -0,0 +1,62 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const parseStacktrace = async (e) => {
+  const StackTracey = (await import("stacktracey")).default;
+  return (await new StackTracey(e).withSourcesAsync()).items.map((it) => ({
+    filename: it.fileShort,
+    line: it.line,
+    callee: it.callee,
+    thirdParty: it.thirdParty,
+    sourceCodeLines: it.sourceFile?.lines
+  }));
+};
+const createInitialError = (e) => ({
+  error: e,
+  cause: e instanceof Error && "cause" in e && e.cause !== void 0 ? createInitialError(e.cause) : void 0
+});
+const useProcessedError = (e) => {
+  const [error, setError] = react.useState(() => createInitialError(e));
+  react.useEffect(() => {
+    setError(createInitialError(e));
+    if (!(e instanceof Error)) {
+      return;
+    }
+    const createErrorWithStackTrace = async (e2) => {
+      return {
+        error: e2,
+        parsedStackStrace: e2 instanceof Error ? await parseStacktrace(e2) : void 0,
+        cause: e2 instanceof Error && "cause" in e2 && e2.cause !== void 0 ? await createErrorWithStackTrace(e2.cause) : void 0
+      };
+    };
+    (async () => {
+      setError(await createErrorWithStackTrace(e));
+    })();
+  }, [e]);
+  return error;
+};
+exports.parseStacktrace = parseStacktrace;
+exports.useProcessedError = useProcessedError;
+//# sourceMappingURL=useParsedStacktrace.cjs.map

package/dist/development/hooks/useParsedStacktrace.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useParsedStacktrace.cjs","sources":["../../../src/hooks/useParsedStacktrace.ts"],"sourcesContent":["import { useEffect, useState } from 'react'\nimport { ErrorType, ProcessedError } from '../ui/DevError'\n\nexport const parseStacktrace = async (e: Error) => {\n\tconst StackTracey = (await import('stacktracey')).default\n\treturn (await new StackTracey(e).withSourcesAsync()).items.map(it => ({\n\t\tfilename: it.fileShort,\n\t\tline: it.line,\n\t\tcallee: it.callee,\n\t\tthirdParty: it.thirdParty,\n\t\tsourceCodeLines: it.sourceFile?.lines,\n\t}))\n}\n\nconst createInitialError = (e: ErrorType): ProcessedError => ({\n\terror: e,\n\tcause: e instanceof Error && 'cause' in e && (e as any).cause !== undefined ? createInitialError((e as any).cause) : undefined,\n})\n\nexport const useProcessedError = (e: ErrorType): ProcessedError => {\n\tconst [error, setError] = useState<ProcessedError>(() => createInitialError(e))\n\tuseEffect(() => {\n\t\tsetError(createInitialError(e))\n\t\tif (!(e instanceof Error)) {\n\t\t\treturn\n\t\t}\n\t\tconst createErrorWithStackTrace = async (e: ErrorType): Promise<ProcessedError> => {\n\t\t\treturn {\n\t\t\t\terror: e,\n\t\t\t\tparsedStackStrace: e instanceof Error ? await parseStacktrace(e) : undefined,\n\t\t\t\tcause: e instanceof Error && 'cause' in e && (e as any).cause !== undefined ? await createErrorWithStackTrace((e as any).cause) : undefined,\n\t\t\t}\n\t\t}\n\t\t(async () => {\n\t\t\tsetError(await createErrorWithStackTrace(e))\n\t\t})()\n\t}, [e])\n\n\treturn error\n}\n"],"names":["useState","useEffect","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAGa,MAAA,kBAAkB,OAAO,MAAa;AAClD,QAAM,eAAe,MAAM,OAAO,aAAa,GAAG;AAC1C,UAAA,MAAM,IAAI,YAAY,CAAC,EAAE,iBAAiB,GAAG,MAAM,IAAI,CAAO,QAAA;AAAA,IACrE,UAAU,GAAG;AAAA,IACb,MAAM,GAAG;AAAA,IACT,QAAQ,GAAG;AAAA,IACX,YAAY,GAAG;AAAA,IACf,iBAAiB,GAAG,YAAY;AAAA,EAC/B,EAAA;AACH;AAEA,MAAM,qBAAqB,CAAC,OAAkC;AAAA,EAC7D,OAAO;AAAA,EACP,OAAO,aAAa,SAAS,WAAW,KAAM,EAAU,UAAU,SAAY,mBAAoB,EAAU,KAAK,IAAI;AACtH;AAEa,MAAA,oBAAoB,CAAC,MAAiC;AAC5D,QAAA,CAAC,OAAO,QAAQ,IAAIA,eAAyB,MAAM,mBAAmB,CAAC,CAAC;AAC9EC,QAAAA,UAAU,MAAM;AACN,aAAA,mBAAmB,CAAC,CAAC;AAC1B,QAAA,EAAE,aAAa,QAAQ;AAC1B;AAAA,IACD;AACM,UAAA,4BAA4B,OAAOC,OAA0C;AAC3E,aAAA;AAAA,QACN,OAAOA;AAAAA,QACP,mBAAmBA,cAAa,QAAQ,MAAM,gBAAgBA,EAAC,IAAI;AAAA,QACnE,OAAOA,cAAa,SAAS,WAAWA,MAAMA,GAAU,UAAU,SAAY,MAAM,0BAA2BA,GAAU,KAAK,IAAI;AAAA,MAAA;AAAA,IACnI;AAED,KAAC,YAAY;AACH,eAAA,MAAM,0BAA0B,CAAC,CAAC;AAAA,IAAA;EACzC,GACD,CAAC,CAAC,CAAC;AAEC,SAAA;AACR;;;"}

package/dist/development/hooks/useParsedStacktrace.js

@@ -0,0 +1,40 @@
+import { useState, useEffect } from "react";
+const parseStacktrace = async (e) => {
+  const StackTracey = (await import("stacktracey")).default;
+  return (await new StackTracey(e).withSourcesAsync()).items.map((it) => ({
+    filename: it.fileShort,
+    line: it.line,
+    callee: it.callee,
+    thirdParty: it.thirdParty,
+    sourceCodeLines: it.sourceFile?.lines
+  }));
+};
+const createInitialError = (e) => ({
+  error: e,
+  cause: e instanceof Error && "cause" in e && e.cause !== void 0 ? createInitialError(e.cause) : void 0
+});
+const useProcessedError = (e) => {
+  const [error, setError] = useState(() => createInitialError(e));
+  useEffect(() => {
+    setError(createInitialError(e));
+    if (!(e instanceof Error)) {
+      return;
+    }
+    const createErrorWithStackTrace = async (e2) => {
+      return {
+        error: e2,
+        parsedStackStrace: e2 instanceof Error ? await parseStacktrace(e2) : void 0,
+        cause: e2 instanceof Error && "cause" in e2 && e2.cause !== void 0 ? await createErrorWithStackTrace(e2.cause) : void 0
+      };
+    };
+    (async () => {
+      setError(await createErrorWithStackTrace(e));
+    })();
+  }, [e]);
+  return error;
+};
+export {
+  parseStacktrace,
+  useProcessedError
+};
+//# sourceMappingURL=useParsedStacktrace.js.map

package/dist/development/hooks/useParsedStacktrace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useParsedStacktrace.js","sources":["../../../src/hooks/useParsedStacktrace.ts"],"sourcesContent":["import { useEffect, useState } from 'react'\nimport { ErrorType, ProcessedError } from '../ui/DevError'\n\nexport const parseStacktrace = async (e: Error) => {\n\tconst StackTracey = (await import('stacktracey')).default\n\treturn (await new StackTracey(e).withSourcesAsync()).items.map(it => ({\n\t\tfilename: it.fileShort,\n\t\tline: it.line,\n\t\tcallee: it.callee,\n\t\tthirdParty: it.thirdParty,\n\t\tsourceCodeLines: it.sourceFile?.lines,\n\t}))\n}\n\nconst createInitialError = (e: ErrorType): ProcessedError => ({\n\terror: e,\n\tcause: e instanceof Error && 'cause' in e && (e as any).cause !== undefined ? createInitialError((e as any).cause) : undefined,\n})\n\nexport const useProcessedError = (e: ErrorType): ProcessedError => {\n\tconst [error, setError] = useState<ProcessedError>(() => createInitialError(e))\n\tuseEffect(() => {\n\t\tsetError(createInitialError(e))\n\t\tif (!(e instanceof Error)) {\n\t\t\treturn\n\t\t}\n\t\tconst createErrorWithStackTrace = async (e: ErrorType): Promise<ProcessedError> => {\n\t\t\treturn {\n\t\t\t\terror: e,\n\t\t\t\tparsedStackStrace: e instanceof Error ? await parseStacktrace(e) : undefined,\n\t\t\t\tcause: e instanceof Error && 'cause' in e && (e as any).cause !== undefined ? await createErrorWithStackTrace((e as any).cause) : undefined,\n\t\t\t}\n\t\t}\n\t\t(async () => {\n\t\t\tsetError(await createErrorWithStackTrace(e))\n\t\t})()\n\t}, [e])\n\n\treturn error\n}\n"],"names":["e"],"mappings":";AAGa,MAAA,kBAAkB,OAAO,MAAa;AAClD,QAAM,eAAe,MAAM,OAAO,aAAa,GAAG;AAC1C,UAAA,MAAM,IAAI,YAAY,CAAC,EAAE,iBAAiB,GAAG,MAAM,IAAI,CAAO,QAAA;AAAA,IACrE,UAAU,GAAG;AAAA,IACb,MAAM,GAAG;AAAA,IACT,QAAQ,GAAG;AAAA,IACX,YAAY,GAAG;AAAA,IACf,iBAAiB,GAAG,YAAY;AAAA,EAC/B,EAAA;AACH;AAEA,MAAM,qBAAqB,CAAC,OAAkC;AAAA,EAC7D,OAAO;AAAA,EACP,OAAO,aAAa,SAAS,WAAW,KAAM,EAAU,UAAU,SAAY,mBAAoB,EAAU,KAAK,IAAI;AACtH;AAEa,MAAA,oBAAoB,CAAC,MAAiC;AAC5D,QAAA,CAAC,OAAO,QAAQ,IAAI,SAAyB,MAAM,mBAAmB,CAAC,CAAC;AAC9E,YAAU,MAAM;AACN,aAAA,mBAAmB,CAAC,CAAC;AAC1B,QAAA,EAAE,aAAa,QAAQ;AAC1B;AAAA,IACD;AACM,UAAA,4BAA4B,OAAOA,OAA0C;AAC3E,aAAA;AAAA,QACN,OAAOA;AAAAA,QACP,mBAAmBA,cAAa,QAAQ,MAAM,gBAAgBA,EAAC,IAAI;AAAA,QACnE,OAAOA,cAAa,SAAS,WAAWA,MAAMA,GAAU,UAAU,SAAY,MAAM,0BAA2BA,GAAU,KAAK,IAAI;AAAA,MAAA;AAAA,IACnI;AAED,KAAC,YAAY;AACH,eAAA,MAAM,0BAA0B,CAAC,CAAC;AAAA,IAAA;EACzC,GACD,CAAC,CAAC,CAAC;AAEC,SAAA;AACR;"}

package/dist/development/index.cjs

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const errorHandling = require("./errorHandling.cjs");
+const useParsedStacktrace = require("./hooks/useParsedStacktrace.cjs");
+const DevBar = require("./ui/DevBar/DevBar.cjs");
+const DevError = require("./ui/DevError/DevError.cjs");
+const DevErrorList = require("./ui/DevError/DevErrorList.cjs");
+const DevErrorBadge = require("./ui/DevError/DevErrorBadge.cjs");
+exports.createErrorHandler = errorHandling.createErrorHandler;
+exports.parseStacktrace = useParsedStacktrace.parseStacktrace;
+exports.useProcessedError = useParsedStacktrace.useProcessedError;
+exports.DevBar = DevBar.DevBar;
+exports.DevPanel = DevBar.DevPanel;
+exports.DevError = DevError.DevError;
+exports.DevErrorList = DevErrorList.DevErrorList;
+exports.DevErrorBadge = DevErrorBadge.DevErrorBadge;
+//# sourceMappingURL=index.cjs.map

package/dist/development/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

package/dist/development/index.js

@@ -0,0 +1,17 @@
+import { createErrorHandler } from "./errorHandling.js";
+import { parseStacktrace, useProcessedError } from "./hooks/useParsedStacktrace.js";
+import { DevBar, DevPanel } from "./ui/DevBar/DevBar.js";
+import { DevError } from "./ui/DevError/DevError.js";
+import { DevErrorList } from "./ui/DevError/DevErrorList.js";
+import { DevErrorBadge } from "./ui/DevError/DevErrorBadge.js";
+export {
+  DevBar,
+  DevError,
+  DevErrorBadge,
+  DevErrorList,
+  DevPanel,
+  createErrorHandler,
+  parseStacktrace,
+  useProcessedError
+};
+//# sourceMappingURL=index.js.map

package/dist/development/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}