@xyo-network/react-error 2.81.9 → 2.82.0

package/dist/node/contexts/index.d.ts

@@ -1,2 +1,2 @@
-export * from './ErrorReporter/index.js';
+export * from './ErrorReporter/index.ts';
 //# sourceMappingURL=index.d.ts.map

package/dist/node/index.cjs

@@ -1,8 +1,11 @@
 "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 __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -15,6 +18,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   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
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.ts
@@ -30,44 +41,50 @@ module.exports = __toCommonJS(src_exports);
 
 // src/components/ErrorBoundary/ThrownErrorBoundary.tsx
 var import_payload_model = require("@xyo-network/payload-model");
-var import_react2 = require("react");
+var import_react3 = __toESM(require("react"), 1);
 
 // src/components/ErrorRender/ErrorAlert.tsx
 var import_icons_material = require("@mui/icons-material");
 var import_material = require("@mui/material");
 var import_react_button = require("@xylabs/react-button");
-var import_jsx_runtime = require("react/jsx-runtime");
-var ErrorAlert = ({ onCancel, error, errorContext, scope, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.Alert, { severity: "error", ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.AlertTitle, { children: "Whoops! Something went wrong" }),
-    errorContext ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "caption", my: 0.5, lineHeight: "1", display: "block", children: errorContext }) : null,
-    scope ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "caption", mr: 0.5, fontWeight: "bold", children: "Scope:" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "caption", children: scope })
-    ] }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "caption", mr: 0.5, fontWeight: "bold", children: "Error:" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "caption", children: error == null ? void 0 : error.message }),
-    onCancel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_button.ButtonEx, { variant: "outlined", size: "small", onClick: onCancel, position: "absolute", style: { right: 8, top: 8 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ExitToApp, { fontSize: "small" }) }) : null
-  ] });
-};
+var import_react = __toESM(require("react"), 1);
+var ErrorAlert = /* @__PURE__ */ __name(({ title = "Whoops! Something went wrong", onCancel, error = "An unknown error occurred", errorContext, scope, ...props }) => {
+  const finalScope = scope ?? errorContext;
+  return /* @__PURE__ */ import_react.default.createElement(import_material.Alert, {
+    severity: "error",
+    ...props
+  }, /* @__PURE__ */ import_react.default.createElement(import_material.AlertTitle, null, title), finalScope ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_material.Typography, {
+    variant: "caption",
+    mr: 0.5,
+    fontWeight: "bold"
+  }, "Scope:"), /* @__PURE__ */ import_react.default.createElement(import_material.Typography, {
+    variant: "caption"
+  }, finalScope)) : null, /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_material.Typography, {
+    variant: "caption",
+    mr: 0.5,
+    fontWeight: "bold"
+  }, "Error:"), /* @__PURE__ */ import_react.default.createElement(import_material.Typography, {
+    variant: "caption"
+  }, typeof error === "string" ? error : error == null ? void 0 : error.message)), onCancel ? /* @__PURE__ */ import_react.default.createElement(import_react_button.ButtonEx, {
+    variant: "outlined",
+    size: "small",
+    onClick: onCancel,
+    position: "absolute",
+    style: {
+      right: 8,
+      top: 8
+    }
+  }, /* @__PURE__ */ import_react.default.createElement(import_icons_material.ExitToApp, {
+    fontSize: "small"
+  })) : null);
+}, "ErrorAlert");
 
 // src/components/ErrorRender/Render.tsx
 var import_react_flexbox = require("@xylabs/react-flexbox");
-var import_react = require("react");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var ErrorRender = ({
-  onCancel,
-  error,
-  noErrorDisplay = false,
-  customError = null,
-  children,
-  errorContext,
-  scope,
-  useLocation,
-  ...props
-}) => {
+var import_react2 = __toESM(require("react"), 1);
+var ErrorRender = /* @__PURE__ */ __name(({ onCancel, error, noErrorDisplay = false, customError = null, children, errorContext, scope, useLocation, ...props }) => {
   const location = useLocation == null ? void 0 : useLocation();
-  (0, import_react.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     if (location) {
       location.state = {
         from: {
@@ -75,21 +92,40 @@ var ErrorRender = ({
         }
       };
     }
-  }, [location]);
-  return error ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_flexbox.FlexCol, { alignItems: "stretch", ...props, children: noErrorDisplay ? customError : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_flexbox.FlexCol, { alignItems: "center", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ErrorAlert, { error, errorContext, onCancel, scope }) }) }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children }) ?? null;
-};
+  }, [
+    location
+  ]);
+  return error ? /* @__PURE__ */ import_react2.default.createElement(import_react_flexbox.FlexCol, {
+    alignItems: "stretch",
+    ...props
+  }, noErrorDisplay ? customError : /* @__PURE__ */ import_react2.default.createElement(import_react_flexbox.FlexCol, {
+    alignItems: "center",
+    ...props
+  }, /* @__PURE__ */ import_react2.default.createElement(ErrorAlert, {
+    error,
+    errorContext,
+    onCancel,
+    scope
+  }))) : /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, children) ?? null;
+}, "ErrorRender");
 
 // src/components/ErrorBoundary/ThrownErrorBoundary.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var ThrownErrorBoundary = class _ThrownErrorBoundary extends import_react2.Component {
+var _ThrownErrorBoundary = class _ThrownErrorBoundary extends import_react3.Component {
   state = {
     xyoError: void 0
   };
   static getDerivedStateFromError(error) {
-    return { hasError: true, xyoError: _ThrownErrorBoundary.normalizeError(error) };
+    return {
+      hasError: true,
+      xyoError: _ThrownErrorBoundary.normalizeError(error)
+    };
   }
   static normalizeError(error) {
-    return error.schema === import_payload_model.ModuleErrorSchema ? error : { message: error.message, schema: import_payload_model.ModuleErrorSchema, sources: [] };
+    return error.schema === import_payload_model.ModuleErrorSchema ? error : {
+      message: error.message,
+      schema: import_payload_model.ModuleErrorSchema,
+      sources: []
+    };
   }
   componentDidCatch(error, errorInfo) {
     const { rethrow, rollbar } = this.props;
@@ -102,45 +138,58 @@ var ThrownErrorBoundary = class _ThrownErrorBoundary extends import_react2.Compo
   }
   render() {
     const { xyoError } = this.state;
-    const { children, boundaryName, errorComponent, scope } = this.props;
+    const { children, boundaryName, errorComponent, scope, title } = this.props;
     if (xyoError) {
       if (errorComponent) {
         return errorComponent(xyoError);
       }
-      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ErrorRender, { error: xyoError, errorContext: `${boundaryName} Boundary`, scope });
+      return /* @__PURE__ */ import_react3.default.createElement(ErrorRender, {
+        error: xyoError,
+        errorContext: `${boundaryName} Boundary`,
+        scope,
+        title
+      });
     }
     return children;
   }
 };
+__name(_ThrownErrorBoundary, "ThrownErrorBoundary");
+var ThrownErrorBoundary = _ThrownErrorBoundary;
 
 // src/contexts/ErrorReporter/Provider.tsx
-var import_react4 = require("react");
+var import_react5 = __toESM(require("react"), 1);
 
 // src/contexts/ErrorReporter/Context.ts
-var import_react3 = require("react");
-var ErrorReporterContext = (0, import_react3.createContext)({});
+var import_react4 = require("react");
+var ErrorReporterContext = (0, import_react4.createContext)({});
 
 // src/contexts/ErrorReporter/Provider.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var ErrorReporterProvider = ({ children, rollbar }) => {
-  const [rollbarInstance, setRollBarInstance] = (0, import_react4.useState)();
-  (0, import_react4.useEffect)(() => {
+var ErrorReporterProvider = /* @__PURE__ */ __name(({ children, rollbar }) => {
+  const [rollbarInstance, setRollBarInstance] = (0, import_react5.useState)();
+  (0, import_react5.useEffect)(() => {
     if (rollbarInstance) {
       setRollBarInstance(rollbarInstance);
     }
-  }, [rollbar, rollbarInstance]);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ErrorReporterContext.Provider, { value: { rollbar }, children });
-};
+  }, [
+    rollbar,
+    rollbarInstance
+  ]);
+  return /* @__PURE__ */ import_react5.default.createElement(ErrorReporterContext.Provider, {
+    value: {
+      rollbar
+    }
+  }, children);
+}, "ErrorReporterProvider");
 
 // src/contexts/ErrorReporter/useRollbar.tsx
-var import_react5 = require("react");
-var useRollbar = () => {
-  const context = (0, import_react5.useContext)(ErrorReporterContext);
+var import_react6 = require("react");
+var useRollbar = /* @__PURE__ */ __name(() => {
+  const context = (0, import_react6.useContext)(ErrorReporterContext);
   if (context === void 0) {
     console.warn("useRollbar must be used within a ErrorReporterContext");
   }
   return context ?? {};
-};
+}, "useRollbar");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ErrorAlert,

package/dist/node/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts","../../src/components/ErrorBoundary/ThrownErrorBoundary.tsx","../../src/components/ErrorRender/ErrorAlert.tsx","../../src/components/ErrorRender/Render.tsx","../../src/contexts/ErrorReporter/Provider.tsx","../../src/contexts/ErrorReporter/Context.ts","../../src/contexts/ErrorReporter/useRollbar.tsx"],"sourcesContent":["export * from './components/index.js'\nexport * from './contexts/index.js'\n","import { ModuleError, ModuleErrorSchema } from '@xyo-network/payload-model'\nimport { Component, ErrorInfo, ReactNode } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorRender } from '../ErrorRender/index.js'\n\nexport interface ThrownErrorBoundaryProps {\n  boundaryName?: string\n  children: ReactNode\n  errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode\n  rethrow?: boolean\n  rollbar?: Rollbar\n  scope?: string\n}\n\nexport interface ThrownErrorBoundaryState {\n  xyoError?: ModuleError\n}\n\nexport class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, ThrownErrorBoundaryState> {\n  override state: ThrownErrorBoundaryState = {\n    xyoError: undefined,\n  }\n\n  static getDerivedStateFromError(error: Error) {\n    return { hasError: true, xyoError: ThrownErrorBoundary.normalizeError(error) } as ThrownErrorBoundaryState\n  }\n\n  static normalizeError(error: Error | ModuleError): ModuleError {\n    return (\n      (error as ModuleError).schema === ModuleErrorSchema ?\n        error\n      : { message: error.message, schema: ModuleErrorSchema, sources: [] }) as ModuleError\n  }\n\n  override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n    const { rethrow, rollbar } = this.props\n    const { xyoError } = this.state\n\n    rollbar?.error(error)\n\n    console.error('Error:', xyoError, errorInfo)\n    if (rethrow) {\n      throw error\n    }\n  }\n\n  override render() {\n    const { xyoError } = this.state\n    const { children, boundaryName, errorComponent, scope } = this.props\n    if (xyoError) {\n      if (errorComponent) {\n        return errorComponent(xyoError)\n      }\n      return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} scope={scope} />\n    }\n\n    return children\n  }\n}\n","import { ExitToApp as ExitIcon } from '@mui/icons-material'\nimport { Alert, AlertProps, AlertTitle, Typography } from '@mui/material'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { ModuleError } from '@xyo-network/payload-model'\n\nexport interface ErrorAlertProps extends AlertProps {\n  error?: ModuleError | Error\n  errorContext?: string\n  onCancel?: () => void\n  scope?: string\n}\n\nexport const ErrorAlert: React.FC<ErrorAlertProps> = ({ onCancel, error, errorContext, scope, ...props }) => {\n  return (\n    <Alert severity=\"error\" {...props}>\n      <AlertTitle>Whoops! Something went wrong</AlertTitle>\n      {errorContext ?\n        <Typography variant=\"caption\" my={0.5} lineHeight=\"1\" display=\"block\">\n          {errorContext}\n        </Typography>\n      : null}\n      {scope ?\n        <>\n          <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n            Scope:\n          </Typography>\n          <Typography variant=\"caption\">{scope}</Typography>\n        </>\n      : null}\n      <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n        Error:\n      </Typography>\n      <Typography variant=\"caption\">{error?.message}</Typography>\n      {onCancel ?\n        <ButtonEx variant=\"outlined\" size=\"small\" onClick={onCancel} position=\"absolute\" style={{ right: 8, top: 8 }}>\n          <ExitIcon fontSize=\"small\" />\n        </ButtonEx>\n      : null}\n    </Alert>\n  )\n}\n","import { FlexCol } from '@xylabs/react-flexbox'\nimport { useEffect } from 'react'\n\nimport { ErrorAlert } from './ErrorAlert.js'\nimport { ErrorRenderProps } from './Props.js'\n\nexport const ErrorRender: React.FC<ErrorRenderProps> = ({\n  onCancel,\n  error,\n  noErrorDisplay = false,\n  customError = null,\n  children,\n  errorContext,\n  scope,\n  useLocation,\n  ...props\n}) => {\n  const location = useLocation?.()\n  useEffect(() => {\n    if (location) {\n      // ensure we end up at the same place we are now after logging in\n      location.state = {\n        from: {\n          pathname: window.location.pathname,\n        },\n      }\n    }\n  }, [location])\n\n  return error ?\n      <FlexCol alignItems=\"stretch\" {...props}>\n        {noErrorDisplay ?\n          customError\n        : <FlexCol alignItems=\"center\" {...props}>\n            <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} scope={scope} />\n          </FlexCol>\n        }\n      </FlexCol>\n    : (<>{children}</> ?? null)\n}\n","import { WithChildren } from '@xylabs/react-shared'\nimport { useEffect, useState } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorReporterContext } from './Context.js'\n\nexport interface ErrorReporterProviderProps {\n  rollbar: Rollbar\n}\n\nconst ErrorReporterProvider: React.FC<WithChildren<ErrorReporterProviderProps>> = ({ children, rollbar }) => {\n  const [rollbarInstance, setRollBarInstance] = useState<Rollbar>()\n\n  useEffect(() => {\n    if (rollbarInstance) {\n      setRollBarInstance(rollbarInstance)\n    }\n  }, [rollbar, rollbarInstance])\n\n  return <ErrorReporterContext.Provider value={{ rollbar }}>{children}</ErrorReporterContext.Provider>\n}\n\nexport { ErrorReporterProvider }\n","import { createContext } from 'react'\n\nimport { ErrorReporterContextState } from './State.js'\n\nexport const ErrorReporterContext = createContext<ErrorReporterContextState>({})\n","import { useContext } from 'react'\n\nimport { ErrorReporterContext } from './Context.js'\n\nconst useRollbar = () => {\n  const context = useContext(ErrorReporterContext)\n  if (context === undefined) {\n    console.warn('useRollbar must be used within a ErrorReporterContext')\n  }\n\n  return context ?? {}\n}\n\nexport { useRollbar }\n"],"mappings":"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","names":["import_react","ExitIcon","import_jsx_runtime","import_jsx_runtime","import_react","import_react","import_jsx_runtime","import_react"]}
+{"version":3,"sources":["../../src/index.ts","../../src/components/ErrorBoundary/ThrownErrorBoundary.tsx","../../src/components/ErrorRender/ErrorAlert.tsx","../../src/components/ErrorRender/Render.tsx","../../src/contexts/ErrorReporter/Provider.tsx","../../src/contexts/ErrorReporter/Context.ts","../../src/contexts/ErrorReporter/useRollbar.tsx"],"sourcesContent":["export * from './components/index.ts'\nexport * from './contexts/index.ts'\n","import { ModuleError, ModuleErrorSchema } from '@xyo-network/payload-model'\nimport React, { Component, ErrorInfo, ReactNode } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorRender } from '../ErrorRender/index.ts'\n\nexport interface ThrownErrorBoundaryProps {\n  boundaryName?: string\n  children: ReactNode\n  errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode\n  rethrow?: boolean\n  rollbar?: Rollbar\n  scope?: string\n  title?: string\n}\n\nexport interface ThrownErrorBoundaryState {\n  xyoError?: ModuleError\n}\n\nexport class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, ThrownErrorBoundaryState> {\n  override state: ThrownErrorBoundaryState = {\n    xyoError: undefined,\n  }\n\n  static getDerivedStateFromError(error: Error) {\n    return { hasError: true, xyoError: ThrownErrorBoundary.normalizeError(error) } as ThrownErrorBoundaryState\n  }\n\n  static normalizeError(error: Error | ModuleError): ModuleError {\n    return (\n      (error as ModuleError).schema === ModuleErrorSchema\n        ? error\n        : { message: error.message, schema: ModuleErrorSchema, sources: [] }) as ModuleError\n  }\n\n  override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n    const { rethrow, rollbar } = this.props\n    const { xyoError } = this.state\n\n    rollbar?.error(error)\n\n    console.error('Error:', xyoError, errorInfo)\n    if (rethrow) {\n      throw error\n    }\n  }\n\n  override render() {\n    const { xyoError } = this.state\n    const { children, boundaryName, errorComponent, scope, title } = this.props\n    if (xyoError) {\n      if (errorComponent) {\n        return errorComponent(xyoError)\n      }\n      return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} scope={scope} title={title} />\n    }\n\n    return children\n  }\n}\n","import { ExitToApp as ExitIcon } from '@mui/icons-material'\nimport { Alert, AlertProps, AlertTitle, Typography } from '@mui/material'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { ModuleError } from '@xyo-network/payload-model'\nimport React from 'react'\n\nexport interface ErrorAlertProps extends AlertProps {\n  error?: ModuleError | Error | string\n  /** @deprecated use scope instead */\n  errorContext?: string\n  onCancel?: () => void\n  scope?: string\n}\n\nexport const ErrorAlert: React.FC<ErrorAlertProps> = ({\n  title = 'Whoops! Something went wrong',\n  onCancel,\n  error = 'An unknown error occurred',\n  errorContext,\n  scope,\n  ...props\n}) => {\n  const finalScope = scope ?? errorContext\n  return (\n    <Alert severity=\"error\" {...props}>\n      <AlertTitle>{title}</AlertTitle>\n      {finalScope\n        ? (\n            <div>\n              <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n                Scope:\n              </Typography>\n              <Typography variant=\"caption\">{finalScope}</Typography>\n            </div>\n          )\n        : null}\n      <div>\n        <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n          Error:\n        </Typography>\n        <Typography variant=\"caption\">{typeof error === 'string' ? error : error?.message}</Typography>\n      </div>\n      {onCancel\n        ? (\n            <ButtonEx variant=\"outlined\" size=\"small\" onClick={onCancel} position=\"absolute\" style={{ right: 8, top: 8 }}>\n              <ExitIcon fontSize=\"small\" />\n            </ButtonEx>\n          )\n        : null}\n    </Alert>\n  )\n}\n","import { FlexCol } from '@xylabs/react-flexbox'\nimport React, { useEffect } from 'react'\n\nimport { ErrorAlert } from './ErrorAlert.tsx'\nimport { ErrorRenderProps } from './Props.ts'\n\nexport const ErrorRender: React.FC<ErrorRenderProps> = ({\n  onCancel,\n  error,\n  noErrorDisplay = false,\n  customError = null,\n  children,\n  errorContext,\n  scope,\n  useLocation,\n  ...props\n}) => {\n  const location = useLocation?.()\n  useEffect(() => {\n    if (location) {\n      // ensure we end up at the same place we are now after logging in\n      location.state = {\n        from: {\n          pathname: window.location.pathname,\n        },\n      }\n    }\n  }, [location])\n\n  return error\n    ? (\n        <FlexCol alignItems=\"stretch\" {...props}>\n          {noErrorDisplay\n            ? customError\n            : (\n                <FlexCol alignItems=\"center\" {...props}>\n                  <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} scope={scope} />\n                </FlexCol>\n              )}\n        </FlexCol>\n      )\n    : (<>{children}</> ?? null)\n}\n","import { WithChildren } from '@xylabs/react-shared'\nimport React, { useEffect, useState } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorReporterContext } from './Context.ts'\n\nexport interface ErrorReporterProviderProps {\n  rollbar: Rollbar\n}\n\nconst ErrorReporterProvider: React.FC<WithChildren<ErrorReporterProviderProps>> = ({ children, rollbar }) => {\n  const [rollbarInstance, setRollBarInstance] = useState<Rollbar>()\n\n  useEffect(() => {\n    if (rollbarInstance) {\n      setRollBarInstance(rollbarInstance)\n    }\n  }, [rollbar, rollbarInstance])\n\n  // eslint-disable-next-line @eslint-react/no-unstable-context-value\n  return <ErrorReporterContext.Provider value={{ rollbar }}>{children}</ErrorReporterContext.Provider>\n}\n\nexport { ErrorReporterProvider }\n","import { createContext } from 'react'\n\nimport { ErrorReporterContextState } from './State.ts'\n\nexport const ErrorReporterContext = createContext<ErrorReporterContextState>({})\n","import { useContext } from 'react'\n\nimport { ErrorReporterContext } from './Context.ts'\n\nconst useRollbar = () => {\n  const context = useContext(ErrorReporterContext)\n  if (context === undefined) {\n    console.warn('useRollbar must be used within a ErrorReporterContext')\n  }\n\n  return context ?? {}\n}\n\nexport { useRollbar }\n"],"mappings":"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","names":["import_react","ErrorAlert","title","onCancel","error","errorContext","scope","props","finalScope","React","Alert","severity","AlertTitle","div","Typography","variant","mr","fontWeight","message","ButtonEx","size","onClick","position","style","right","top","ExitIcon","fontSize","import_react","ErrorRender","onCancel","error","noErrorDisplay","customError","children","errorContext","scope","useLocation","props","location","useEffect","state","from","pathname","window","React","FlexCol","alignItems","ErrorAlert","ThrownErrorBoundary","Component","state","xyoError","undefined","getDerivedStateFromError","error","hasError","normalizeError","schema","ModuleErrorSchema","message","sources","componentDidCatch","errorInfo","rethrow","rollbar","props","console","render","children","boundaryName","errorComponent","scope","title","React","ErrorRender","errorContext","import_react","import_react","ErrorReporterContext","createContext","ErrorReporterProvider","children","rollbar","rollbarInstance","setRollBarInstance","useState","useEffect","React","ErrorReporterContext","Provider","value","import_react","useRollbar","context","useContext","ErrorReporterContext","undefined","console","warn"]}

package/dist/node/index.d.cts

@@ -1,3 +1,3 @@
-export * from './components/index.js';
-export * from './contexts/index.js';
+export * from './components/index.ts';
+export * from './contexts/index.ts';
 //# sourceMappingURL=index.d.ts.map

package/dist/node/index.d.mts

@@ -1,3 +1,3 @@
-export * from './components/index.js';
-export * from './contexts/index.js';
+export * from './components/index.ts';
+export * from './contexts/index.ts';
 //# sourceMappingURL=index.d.ts.map

package/dist/node/index.d.ts

@@ -1,3 +1,3 @@
-export * from './components/index.js';
-export * from './contexts/index.js';
+export * from './components/index.ts';
+export * from './contexts/index.ts';
 //# sourceMappingURL=index.d.ts.map

package/dist/node/index.mjs

@@ -0,0 +1,162 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// src/components/ErrorBoundary/ThrownErrorBoundary.tsx
+import { ModuleErrorSchema } from "@xyo-network/payload-model";
+import React3, { Component } from "react";
+
+// src/components/ErrorRender/ErrorAlert.tsx
+import { ExitToApp as ExitIcon } from "@mui/icons-material";
+import { Alert, AlertTitle, Typography } from "@mui/material";
+import { ButtonEx } from "@xylabs/react-button";
+import React from "react";
+var ErrorAlert = /* @__PURE__ */ __name(({ title = "Whoops! Something went wrong", onCancel, error = "An unknown error occurred", errorContext, scope, ...props }) => {
+  const finalScope = scope ?? errorContext;
+  return /* @__PURE__ */ React.createElement(Alert, {
+    severity: "error",
+    ...props
+  }, /* @__PURE__ */ React.createElement(AlertTitle, null, title), finalScope ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Typography, {
+    variant: "caption",
+    mr: 0.5,
+    fontWeight: "bold"
+  }, "Scope:"), /* @__PURE__ */ React.createElement(Typography, {
+    variant: "caption"
+  }, finalScope)) : null, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Typography, {
+    variant: "caption",
+    mr: 0.5,
+    fontWeight: "bold"
+  }, "Error:"), /* @__PURE__ */ React.createElement(Typography, {
+    variant: "caption"
+  }, typeof error === "string" ? error : error == null ? void 0 : error.message)), onCancel ? /* @__PURE__ */ React.createElement(ButtonEx, {
+    variant: "outlined",
+    size: "small",
+    onClick: onCancel,
+    position: "absolute",
+    style: {
+      right: 8,
+      top: 8
+    }
+  }, /* @__PURE__ */ React.createElement(ExitIcon, {
+    fontSize: "small"
+  })) : null);
+}, "ErrorAlert");
+
+// src/components/ErrorRender/Render.tsx
+import { FlexCol } from "@xylabs/react-flexbox";
+import React2, { useEffect } from "react";
+var ErrorRender = /* @__PURE__ */ __name(({ onCancel, error, noErrorDisplay = false, customError = null, children, errorContext, scope, useLocation, ...props }) => {
+  const location = useLocation == null ? void 0 : useLocation();
+  useEffect(() => {
+    if (location) {
+      location.state = {
+        from: {
+          pathname: window.location.pathname
+        }
+      };
+    }
+  }, [
+    location
+  ]);
+  return error ? /* @__PURE__ */ React2.createElement(FlexCol, {
+    alignItems: "stretch",
+    ...props
+  }, noErrorDisplay ? customError : /* @__PURE__ */ React2.createElement(FlexCol, {
+    alignItems: "center",
+    ...props
+  }, /* @__PURE__ */ React2.createElement(ErrorAlert, {
+    error,
+    errorContext,
+    onCancel,
+    scope
+  }))) : /* @__PURE__ */ React2.createElement(React2.Fragment, null, children) ?? null;
+}, "ErrorRender");
+
+// src/components/ErrorBoundary/ThrownErrorBoundary.tsx
+var _ThrownErrorBoundary = class _ThrownErrorBoundary extends Component {
+  state = {
+    xyoError: void 0
+  };
+  static getDerivedStateFromError(error) {
+    return {
+      hasError: true,
+      xyoError: _ThrownErrorBoundary.normalizeError(error)
+    };
+  }
+  static normalizeError(error) {
+    return error.schema === ModuleErrorSchema ? error : {
+      message: error.message,
+      schema: ModuleErrorSchema,
+      sources: []
+    };
+  }
+  componentDidCatch(error, errorInfo) {
+    const { rethrow, rollbar } = this.props;
+    const { xyoError } = this.state;
+    rollbar == null ? void 0 : rollbar.error(error);
+    console.error("Error:", xyoError, errorInfo);
+    if (rethrow) {
+      throw error;
+    }
+  }
+  render() {
+    const { xyoError } = this.state;
+    const { children, boundaryName, errorComponent, scope, title } = this.props;
+    if (xyoError) {
+      if (errorComponent) {
+        return errorComponent(xyoError);
+      }
+      return /* @__PURE__ */ React3.createElement(ErrorRender, {
+        error: xyoError,
+        errorContext: `${boundaryName} Boundary`,
+        scope,
+        title
+      });
+    }
+    return children;
+  }
+};
+__name(_ThrownErrorBoundary, "ThrownErrorBoundary");
+var ThrownErrorBoundary = _ThrownErrorBoundary;
+
+// src/contexts/ErrorReporter/Provider.tsx
+import React4, { useEffect as useEffect2, useState } from "react";
+
+// src/contexts/ErrorReporter/Context.ts
+import { createContext } from "react";
+var ErrorReporterContext = createContext({});
+
+// src/contexts/ErrorReporter/Provider.tsx
+var ErrorReporterProvider = /* @__PURE__ */ __name(({ children, rollbar }) => {
+  const [rollbarInstance, setRollBarInstance] = useState();
+  useEffect2(() => {
+    if (rollbarInstance) {
+      setRollBarInstance(rollbarInstance);
+    }
+  }, [
+    rollbar,
+    rollbarInstance
+  ]);
+  return /* @__PURE__ */ React4.createElement(ErrorReporterContext.Provider, {
+    value: {
+      rollbar
+    }
+  }, children);
+}, "ErrorReporterProvider");
+
+// src/contexts/ErrorReporter/useRollbar.tsx
+import { useContext } from "react";
+var useRollbar = /* @__PURE__ */ __name(() => {
+  const context = useContext(ErrorReporterContext);
+  if (context === void 0) {
+    console.warn("useRollbar must be used within a ErrorReporterContext");
+  }
+  return context ?? {};
+}, "useRollbar");
+export {
+  ErrorAlert,
+  ErrorRender,
+  ErrorReporterProvider,
+  ThrownErrorBoundary,
+  useRollbar
+};
+//# sourceMappingURL=index.mjs.map

package/dist/node/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/ErrorBoundary/ThrownErrorBoundary.tsx","../../src/components/ErrorRender/ErrorAlert.tsx","../../src/components/ErrorRender/Render.tsx","../../src/contexts/ErrorReporter/Provider.tsx","../../src/contexts/ErrorReporter/Context.ts","../../src/contexts/ErrorReporter/useRollbar.tsx"],"sourcesContent":["import { ModuleError, ModuleErrorSchema } from '@xyo-network/payload-model'\nimport React, { Component, ErrorInfo, ReactNode } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorRender } from '../ErrorRender/index.ts'\n\nexport interface ThrownErrorBoundaryProps {\n  boundaryName?: string\n  children: ReactNode\n  errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode\n  rethrow?: boolean\n  rollbar?: Rollbar\n  scope?: string\n  title?: string\n}\n\nexport interface ThrownErrorBoundaryState {\n  xyoError?: ModuleError\n}\n\nexport class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, ThrownErrorBoundaryState> {\n  override state: ThrownErrorBoundaryState = {\n    xyoError: undefined,\n  }\n\n  static getDerivedStateFromError(error: Error) {\n    return { hasError: true, xyoError: ThrownErrorBoundary.normalizeError(error) } as ThrownErrorBoundaryState\n  }\n\n  static normalizeError(error: Error | ModuleError): ModuleError {\n    return (\n      (error as ModuleError).schema === ModuleErrorSchema\n        ? error\n        : { message: error.message, schema: ModuleErrorSchema, sources: [] }) as ModuleError\n  }\n\n  override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n    const { rethrow, rollbar } = this.props\n    const { xyoError } = this.state\n\n    rollbar?.error(error)\n\n    console.error('Error:', xyoError, errorInfo)\n    if (rethrow) {\n      throw error\n    }\n  }\n\n  override render() {\n    const { xyoError } = this.state\n    const { children, boundaryName, errorComponent, scope, title } = this.props\n    if (xyoError) {\n      if (errorComponent) {\n        return errorComponent(xyoError)\n      }\n      return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} scope={scope} title={title} />\n    }\n\n    return children\n  }\n}\n","import { ExitToApp as ExitIcon } from '@mui/icons-material'\nimport { Alert, AlertProps, AlertTitle, Typography } from '@mui/material'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { ModuleError } from '@xyo-network/payload-model'\nimport React from 'react'\n\nexport interface ErrorAlertProps extends AlertProps {\n  error?: ModuleError | Error | string\n  /** @deprecated use scope instead */\n  errorContext?: string\n  onCancel?: () => void\n  scope?: string\n}\n\nexport const ErrorAlert: React.FC<ErrorAlertProps> = ({\n  title = 'Whoops! Something went wrong',\n  onCancel,\n  error = 'An unknown error occurred',\n  errorContext,\n  scope,\n  ...props\n}) => {\n  const finalScope = scope ?? errorContext\n  return (\n    <Alert severity=\"error\" {...props}>\n      <AlertTitle>{title}</AlertTitle>\n      {finalScope\n        ? (\n            <div>\n              <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n                Scope:\n              </Typography>\n              <Typography variant=\"caption\">{finalScope}</Typography>\n            </div>\n          )\n        : null}\n      <div>\n        <Typography variant=\"caption\" mr={0.5} fontWeight=\"bold\">\n          Error:\n        </Typography>\n        <Typography variant=\"caption\">{typeof error === 'string' ? error : error?.message}</Typography>\n      </div>\n      {onCancel\n        ? (\n            <ButtonEx variant=\"outlined\" size=\"small\" onClick={onCancel} position=\"absolute\" style={{ right: 8, top: 8 }}>\n              <ExitIcon fontSize=\"small\" />\n            </ButtonEx>\n          )\n        : null}\n    </Alert>\n  )\n}\n","import { FlexCol } from '@xylabs/react-flexbox'\nimport React, { useEffect } from 'react'\n\nimport { ErrorAlert } from './ErrorAlert.tsx'\nimport { ErrorRenderProps } from './Props.ts'\n\nexport const ErrorRender: React.FC<ErrorRenderProps> = ({\n  onCancel,\n  error,\n  noErrorDisplay = false,\n  customError = null,\n  children,\n  errorContext,\n  scope,\n  useLocation,\n  ...props\n}) => {\n  const location = useLocation?.()\n  useEffect(() => {\n    if (location) {\n      // ensure we end up at the same place we are now after logging in\n      location.state = {\n        from: {\n          pathname: window.location.pathname,\n        },\n      }\n    }\n  }, [location])\n\n  return error\n    ? (\n        <FlexCol alignItems=\"stretch\" {...props}>\n          {noErrorDisplay\n            ? customError\n            : (\n                <FlexCol alignItems=\"center\" {...props}>\n                  <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} scope={scope} />\n                </FlexCol>\n              )}\n        </FlexCol>\n      )\n    : (<>{children}</> ?? null)\n}\n","import { WithChildren } from '@xylabs/react-shared'\nimport React, { useEffect, useState } from 'react'\nimport Rollbar from 'rollbar'\n\nimport { ErrorReporterContext } from './Context.ts'\n\nexport interface ErrorReporterProviderProps {\n  rollbar: Rollbar\n}\n\nconst ErrorReporterProvider: React.FC<WithChildren<ErrorReporterProviderProps>> = ({ children, rollbar }) => {\n  const [rollbarInstance, setRollBarInstance] = useState<Rollbar>()\n\n  useEffect(() => {\n    if (rollbarInstance) {\n      setRollBarInstance(rollbarInstance)\n    }\n  }, [rollbar, rollbarInstance])\n\n  // eslint-disable-next-line @eslint-react/no-unstable-context-value\n  return <ErrorReporterContext.Provider value={{ rollbar }}>{children}</ErrorReporterContext.Provider>\n}\n\nexport { ErrorReporterProvider }\n","import { createContext } from 'react'\n\nimport { ErrorReporterContextState } from './State.ts'\n\nexport const ErrorReporterContext = createContext<ErrorReporterContextState>({})\n","import { useContext } from 'react'\n\nimport { ErrorReporterContext } from './Context.ts'\n\nconst useRollbar = () => {\n  const context = useContext(ErrorReporterContext)\n  if (context === undefined) {\n    console.warn('useRollbar must be used within a ErrorReporterContext')\n  }\n\n  return context ?? {}\n}\n\nexport { useRollbar }\n"],"mappings":"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","names":["ModuleErrorSchema","React","Component","ExitToApp","ExitIcon","Alert","AlertTitle","Typography","ButtonEx","React","ErrorAlert","title","onCancel","error","errorContext","scope","props","finalScope","Alert","severity","AlertTitle","div","Typography","variant","mr","fontWeight","message","ButtonEx","size","onClick","position","style","right","top","ExitIcon","fontSize","FlexCol","React","useEffect","ErrorRender","onCancel","error","noErrorDisplay","customError","children","errorContext","scope","useLocation","props","location","useEffect","state","from","pathname","window","React","FlexCol","alignItems","ErrorAlert","ThrownErrorBoundary","Component","state","xyoError","undefined","getDerivedStateFromError","error","hasError","normalizeError","schema","ModuleErrorSchema","message","sources","componentDidCatch","errorInfo","rethrow","rollbar","props","console","render","children","boundaryName","errorComponent","scope","title","React","ErrorRender","errorContext","React","useEffect","useState","createContext","ErrorReporterContext","ErrorReporterProvider","children","rollbar","rollbarInstance","setRollBarInstance","useState","useEffect","React","ErrorReporterContext","Provider","value","useContext","useRollbar","context","useContext","ErrorReporterContext","undefined","console","warn"]}

package/package.json

@@ -10,11 +10,11 @@
     "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
   },
   "dependencies": {
-    "@xylabs/react-button": "^3.4.1",
-    "@xylabs/react-flexbox": "^3.4.1",
-    "@xylabs/react-shared": "^3.4.1",
-    "@xyo-network/payload-model": "^2.110.9",
-    "react-router-dom": "^6.25.1"
+    "@xylabs/react-button": "^3.4.2",
+    "@xylabs/react-flexbox": "^3.4.2",
+    "@xylabs/react-shared": "^3.4.2",
+    "@xyo-network/payload-model": "^2.111.3",
+    "react-router-dom": "^6.26.0"
   },
   "peerDependencies": {
     "@mui/icons-material": "^5",
@@ -25,9 +25,9 @@
     "rollbar": "^2"
   },
   "devDependencies": {
-    "@storybook/react": "^7.6.20",
-    "@xylabs/ts-scripts-yarn3": "^3.12.4",
-    "@xylabs/tsconfig-react": "^3.12.4",
+    "@storybook/react": "^8.2.7",
+    "@xylabs/ts-scripts-yarn3": "^3.15.16",
+    "@xylabs/tsconfig-react": "^3.15.16",
     "typescript": "^5.5.4"
   },
   "peerDependenciesMeta": {
@@ -42,7 +42,7 @@
       "node": {
         "import": {
           "types": "./dist/node/index.d.mts",
-          "default": "./dist/node/index.js"
+          "default": "./dist/node/index.mjs"
         },
         "require": {
           "types": "./dist/node/index.d.cts",
@@ -52,19 +52,19 @@
       "browser": {
         "import": {
           "types": "./dist/browser/index.d.mts",
-          "default": "./dist/browser/index.js"
+          "default": "./dist/browser/index.mjs"
         },
         "require": {
           "types": "./dist/browser/index.d.cts",
           "default": "./dist/browser/index.cjs"
         }
       },
-      "default": "./dist/browser/index.js"
+      "default": "./dist/browser/index.mjs"
     },
     "./package.json": "./package.json"
   },
   "main": "dist/browser/index.cjs",
-  "module": "dist/browser/index.js",
+  "module": "dist/browser/index.mjs",
   "homepage": "https://xyo.network",
   "keywords": [
     "xyo",
@@ -86,6 +86,6 @@
   },
   "sideEffects": false,
   "types": "dist/browser/index.d.ts",
-  "version": "2.81.9",
+  "version": "2.82.0",
   "type": "module"
 }

package/src/components/ErrorBoundary/ThrownErrorBoundary.stories.tsx

@@ -1,8 +1,8 @@
-/* eslint-disable import/no-internal-modules */
 import { Alert } from '@mui/material'
 import { Meta, StoryFn } from '@storybook/react'
+import React from 'react'
 
-import { ThrownErrorBoundary } from './ThrownErrorBoundary.js'
+import { ThrownErrorBoundary } from './ThrownErrorBoundary.tsx'
 
 const StorybookEntry: Meta = {
   component: ThrownErrorBoundary,
@@ -22,10 +22,14 @@ Default.args = {}
 
 const CustomErrorComponent = Template.bind({})
 CustomErrorComponent.args = {
-  errorComponent: (e) => <Alert severity="error">Using Custom Error Component with error: {e.message}</Alert>,
+  errorComponent: e => (
+    <Alert severity="error">
+      Using Custom Error Component with error:
+      {e.message}
+    </Alert>
+  ),
 }
 
 export { CustomErrorComponent, Default }
 
-// eslint-disable-next-line import/no-default-export
 export default StorybookEntry

package/src/components/ErrorBoundary/ThrownErrorBoundary.tsx

@@ -1,8 +1,8 @@
 import { ModuleError, ModuleErrorSchema } from '@xyo-network/payload-model'
-import { Component, ErrorInfo, ReactNode } from 'react'
+import React, { Component, ErrorInfo, ReactNode } from 'react'
 import Rollbar from 'rollbar'
 
-import { ErrorRender } from '../ErrorRender/index.js'
+import { ErrorRender } from '../ErrorRender/index.ts'
 
 export interface ThrownErrorBoundaryProps {
   boundaryName?: string
@@ -11,6 +11,7 @@ export interface ThrownErrorBoundaryProps {
   rethrow?: boolean
   rollbar?: Rollbar
   scope?: string
+  title?: string
 }
 
 export interface ThrownErrorBoundaryState {
@@ -28,9 +29,9 @@ export class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, Thr
 
   static normalizeError(error: Error | ModuleError): ModuleError {
     return (
-      (error as ModuleError).schema === ModuleErrorSchema ?
-        error
-      : { message: error.message, schema: ModuleErrorSchema, sources: [] }) as ModuleError
+      (error as ModuleError).schema === ModuleErrorSchema
+        ? error
+        : { message: error.message, schema: ModuleErrorSchema, sources: [] }) as ModuleError
   }
 
   override componentDidCatch(error: Error, errorInfo: ErrorInfo) {
@@ -47,12 +48,12 @@ export class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, Thr
 
   override render() {
     const { xyoError } = this.state
-    const { children, boundaryName, errorComponent, scope } = this.props
+    const { children, boundaryName, errorComponent, scope, title } = this.props
     if (xyoError) {
       if (errorComponent) {
         return errorComponent(xyoError)
       }
-      return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} scope={scope} />
+      return <ErrorRender error={xyoError} errorContext={`${boundaryName} Boundary`} scope={scope} title={title} />
     }
 
     return children

package/src/components/ErrorBoundary/index.ts

@@ -1 +1 @@
-export * from './ThrownErrorBoundary.js'
+export * from './ThrownErrorBoundary.tsx'