@xyo-network/react-error 2.81.10 → 2.83.0

package/dist/browser/index.d.ts

@@ -1,3 +1,62 @@
-export * from './components/index.js';
-export * from './contexts/index.js';
-//# sourceMappingURL=index.d.ts.map
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ModuleError } from '@xyo-network/payload-model';
+import React, { ReactNode, Component, ErrorInfo } from 'react';
+import Rollbar from 'rollbar';
+import { AlertProps } from '@mui/material';
+import { FlexBoxProps } from '@xylabs/react-flexbox';
+import { Location } from 'react-router-dom';
+import { WithChildren } from '@xylabs/react-shared';
+
+interface ThrownErrorBoundaryProps {
+    boundaryName?: string;
+    children: ReactNode;
+    errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode;
+    rethrow?: boolean;
+    rollbar?: Rollbar;
+    scope?: string;
+    title?: string;
+}
+interface ThrownErrorBoundaryState {
+    xyoError?: ModuleError;
+}
+declare class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, ThrownErrorBoundaryState> {
+    state: ThrownErrorBoundaryState;
+    static getDerivedStateFromError(error: Error): ThrownErrorBoundaryState;
+    static normalizeError(error: Error | ModuleError): ModuleError;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    render(): string | number | boolean | react_jsx_runtime.JSX.Element | Iterable<React.ReactNode> | null | undefined;
+}
+
+interface ErrorAlertProps extends AlertProps {
+    error?: ModuleError | Error | string;
+    errorContext?: string;
+    onCancel?: () => void;
+    scope?: string;
+}
+declare const ErrorAlert: React.FC<ErrorAlertProps>;
+
+interface ErrorRenderProps extends FlexBoxProps {
+    customError?: ReactNode;
+    error?: ModuleError | Error;
+    errorContext?: string;
+    noErrorDisplay?: boolean;
+    noReAuth?: boolean;
+    onCancel?: () => void;
+    scope?: string;
+    useLocation?: () => Location;
+}
+
+declare const ErrorRender: React.FC<ErrorRenderProps>;
+
+interface ErrorReporterProviderProps {
+    rollbar: Rollbar;
+}
+declare const ErrorReporterProvider: React.FC<WithChildren<ErrorReporterProviderProps>>;
+
+interface ErrorReporterContextState {
+    rollbar?: Rollbar;
+}
+
+declare const useRollbar: () => ErrorReporterContextState;
+
+export { ErrorAlert, type ErrorAlertProps, ErrorRender, type ErrorRenderProps, type ErrorReporterContextState, ErrorReporterProvider, type ErrorReporterProviderProps, ThrownErrorBoundary, type ThrownErrorBoundaryProps, type ThrownErrorBoundaryState, useRollbar };

package/dist/browser/index.mjs

@@ -0,0 +1,163 @@
+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?.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?.();
+  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 {
+  static {
+    __name(this, "ThrownErrorBoundary");
+  }
+  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?.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;
+  }
+};
+
+// 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/browser/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": "^4.0.0-rc.7",
+    "@xylabs/tsconfig-react": "^4.0.0-rc.7",
     "typescript": "^5.5.4"
   },
   "peerDependenciesMeta": {
@@ -39,32 +39,16 @@
   "docs": "dist/docs.json",
   "exports": {
     ".": {
-      "node": {
-        "import": {
-          "types": "./dist/node/index.d.mts",
-          "default": "./dist/node/index.js"
-        },
-        "require": {
-          "types": "./dist/node/index.d.cts",
-          "default": "./dist/node/index.cjs"
-        }
+      "import": {
+        "types": "./dist/browser/index.d.ts",
+        "default": "./dist/browser/index.mjs"
       },
-      "browser": {
-        "import": {
-          "types": "./dist/browser/index.d.mts",
-          "default": "./dist/browser/index.js"
-        },
-        "require": {
-          "types": "./dist/browser/index.d.cts",
-          "default": "./dist/browser/index.cjs"
-        }
-      },
-      "default": "./dist/browser/index.js"
+      "types": "./dist/browser/index.d.ts",
+      "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 +70,6 @@
   },
   "sideEffects": false,
   "types": "dist/browser/index.d.ts",
-  "version": "2.81.10",
+  "version": "2.83.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
@@ -29,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) {

package/src/components/ErrorBoundary/index.ts

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

package/src/components/ErrorRender/ErrorAlert.stories.tsx

@@ -1,7 +1,7 @@
 import { Meta, StoryFn } from '@storybook/react'
 import React from 'react'
 
-import { ErrorAlert } from './ErrorAlert.js'
+import { ErrorAlert } from './ErrorAlert.tsx'
 
 const StorybookEntry: Meta = {
   argTypes: {},
@@ -38,5 +38,4 @@ WithErrorAndScopeAndTitle.args = { error: 'An error happened', scope: 'Storybook
 
 export { Default, WithError, WithErrorAndScope, WithErrorAndScopeAndTitle, WithScope, WithTitle }
 
-// eslint-disable-next-line import/no-default-export
 export default StorybookEntry

package/src/components/ErrorRender/ErrorAlert.tsx

@@ -2,6 +2,7 @@ import { ExitToApp as ExitIcon } from '@mui/icons-material'
 import { Alert, AlertProps, AlertTitle, Typography } from '@mui/material'
 import { ButtonEx } from '@xylabs/react-button'
 import { ModuleError } from '@xyo-network/payload-model'
+import React from 'react'
 
 export interface ErrorAlertProps extends AlertProps {
   error?: ModuleError | Error | string
@@ -11,7 +12,6 @@ export interface ErrorAlertProps extends AlertProps {
   scope?: string
 }
 
-// eslint-disable-next-line deprecation/deprecation
 export const ErrorAlert: React.FC<ErrorAlertProps> = ({
   title = 'Whoops! Something went wrong',
   onCancel,
@@ -24,25 +24,29 @@ export const ErrorAlert: React.FC<ErrorAlertProps> = ({
   return (
     <Alert severity="error" {...props}>
       <AlertTitle>{title}</AlertTitle>
-      {finalScope ?
-        <div>
-          <Typography variant="caption" mr={0.5} fontWeight="bold">
-            Scope:
-          </Typography>
-          <Typography variant="caption">{finalScope}</Typography>
-        </div>
-      : null}
+      {finalScope
+        ? (
+            <div>
+              <Typography variant="caption" mr={0.5} fontWeight="bold">
+                Scope:
+              </Typography>
+              <Typography variant="caption">{finalScope}</Typography>
+            </div>
+          )
+        : null}
       <div>
         <Typography variant="caption" mr={0.5} fontWeight="bold">
           Error:
         </Typography>
         <Typography variant="caption">{typeof error === 'string' ? error : error?.message}</Typography>
       </div>
-      {onCancel ?
-        <ButtonEx variant="outlined" size="small" onClick={onCancel} position="absolute" style={{ right: 8, top: 8 }}>
-          <ExitIcon fontSize="small" />
-        </ButtonEx>
-      : null}
+      {onCancel
+        ? (
+            <ButtonEx variant="outlined" size="small" onClick={onCancel} position="absolute" style={{ right: 8, top: 8 }}>
+              <ExitIcon fontSize="small" />
+            </ButtonEx>
+          )
+        : null}
     </Alert>
   )
 }

package/src/components/ErrorRender/Render.tsx

@@ -1,8 +1,8 @@
 import { FlexCol } from '@xylabs/react-flexbox'
-import { useEffect } from 'react'
+import React, { useEffect } from 'react'
 
-import { ErrorAlert } from './ErrorAlert.js'
-import { ErrorRenderProps } from './Props.js'
+import { ErrorAlert } from './ErrorAlert.tsx'
+import { ErrorRenderProps } from './Props.ts'
 
 export const ErrorRender: React.FC<ErrorRenderProps> = ({
   onCancel,
@@ -27,14 +27,17 @@ export const ErrorRender: React.FC<ErrorRenderProps> = ({
     }
   }, [location])
 
-  return error ?
-      <FlexCol alignItems="stretch" {...props}>
-        {noErrorDisplay ?
-          customError
-        : <FlexCol alignItems="center" {...props}>
-            <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} scope={scope} />
-          </FlexCol>
-        }
-      </FlexCol>
+  return error
+    ? (
+        <FlexCol alignItems="stretch" {...props}>
+          {noErrorDisplay
+            ? customError
+            : (
+                <FlexCol alignItems="center" {...props}>
+                  <ErrorAlert error={error} errorContext={errorContext} onCancel={onCancel} scope={scope} />
+                </FlexCol>
+              )}
+        </FlexCol>
+      )
     : (<>{children}</> ?? null)
 }

package/src/components/ErrorRender/index.ts

@@ -1,3 +1,3 @@
-export * from './ErrorAlert.js'
-export * from './Props.js'
-export * from './Render.js'
+export * from './ErrorAlert.tsx'
+export * from './Props.ts'
+export * from './Render.tsx'

package/src/components/index.ts

@@ -1,2 +1,2 @@
-export * from './ErrorBoundary/index.js'
-export * from './ErrorRender/index.js'
+export * from './ErrorBoundary/index.ts'
+export * from './ErrorRender/index.ts'

package/src/contexts/ErrorReporter/Context.ts

@@ -1,5 +1,5 @@
 import { createContext } from 'react'
 
-import { ErrorReporterContextState } from './State.js'
+import { ErrorReporterContextState } from './State.ts'
 
 export const ErrorReporterContext = createContext<ErrorReporterContextState>({})

package/src/contexts/ErrorReporter/Provider.stories.tsx

@@ -1,9 +1,10 @@
 import { Typography } from '@mui/material'
 import { Meta, StoryFn } from '@storybook/react'
+import React from 'react'
 import Rollbar from 'rollbar'
 
-import { ErrorReporterProvider } from './Provider.js'
-import { useRollbar } from './useRollbar.js'
+import { ErrorReporterProvider } from './Provider.tsx'
+import { useRollbar } from './useRollbar.tsx'
 
 const StorybookEntry = {
   argTypes: {},
@@ -20,7 +21,14 @@ const RollbarComponent = () => {
   const { rollbar } = useRollbar()
   const rollbarFound = typeof rollbar?.error === 'function'
 
-  return <Typography color={rollbarFound ? 'green' : 'red'}>Rollbar instance {rollbarFound ? '' : 'NOT'} found from context!</Typography>
+  return (
+    <Typography color={rollbarFound ? 'green' : 'red'}>
+      Rollbar instance
+      {rollbarFound ? '' : 'NOT'}
+      {' '}
+      found from context!
+    </Typography>
+  )
 }
 
 const Template: StoryFn<typeof ErrorReporterProvider> = () => {
@@ -36,5 +44,4 @@ const Default = Template.bind({})
 
 export { Default }
 
-// eslint-disable-next-line import/no-default-export
 export default StorybookEntry

package/src/contexts/ErrorReporter/Provider.tsx

@@ -1,8 +1,8 @@
 import { WithChildren } from '@xylabs/react-shared'
-import { useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import Rollbar from 'rollbar'
 
-import { ErrorReporterContext } from './Context.js'
+import { ErrorReporterContext } from './Context.ts'
 
 export interface ErrorReporterProviderProps {
   rollbar: Rollbar
@@ -17,6 +17,7 @@ const ErrorReporterProvider: React.FC<WithChildren<ErrorReporterProviderProps>>
     }
   }, [rollbar, rollbarInstance])
 
+  // eslint-disable-next-line @eslint-react/no-unstable-context-value
   return <ErrorReporterContext.Provider value={{ rollbar }}>{children}</ErrorReporterContext.Provider>
 }
 

package/src/contexts/ErrorReporter/index.ts

@@ -1,3 +1,3 @@
-export * from './Provider.js'
-export * from './State.js'
-export * from './useRollbar.js'
+export * from './Provider.tsx'
+export * from './State.ts'
+export * from './useRollbar.tsx'

package/src/contexts/ErrorReporter/useRollbar.tsx

@@ -1,6 +1,6 @@
 import { useContext } from 'react'
 
-import { ErrorReporterContext } from './Context.js'
+import { ErrorReporterContext } from './Context.ts'
 
 const useRollbar = () => {
   const context = useContext(ErrorReporterContext)

package/src/contexts/index.ts

@@ -1 +1 @@
-export * from './ErrorReporter/index.js'
+export * from './ErrorReporter/index.ts'

package/src/index.ts

@@ -1,2 +1,2 @@
-export * from './components/index.js'
-export * from './contexts/index.js'
+export * from './components/index.ts'
+export * from './contexts/index.ts'

package/xy.config.ts

@@ -0,0 +1,12 @@
+import { XyTsupConfig } from '@xylabs/ts-scripts-yarn3'
+const config: XyTsupConfig = {
+  compile: {
+    browser: {
+      src: true,
+    },
+    node: {},
+    neutral: {},
+  },
+}
+
+export default config

package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.cts

@@ -1,23 +0,0 @@
-import { ModuleError } from '@xyo-network/payload-model';
-import { Component, ErrorInfo, ReactNode } from 'react';
-import Rollbar from 'rollbar';
-export interface ThrownErrorBoundaryProps {
-    boundaryName?: string;
-    children: ReactNode;
-    errorComponent?: (e: ModuleError, boundaryName?: string) => ReactNode;
-    rethrow?: boolean;
-    rollbar?: Rollbar;
-    scope?: string;
-    title?: string;
-}
-export interface ThrownErrorBoundaryState {
-    xyoError?: ModuleError;
-}
-export declare class ThrownErrorBoundary extends Component<ThrownErrorBoundaryProps, ThrownErrorBoundaryState> {
-    state: ThrownErrorBoundaryState;
-    static getDerivedStateFromError(error: Error): ThrownErrorBoundaryState;
-    static normalizeError(error: Error | ModuleError): ModuleError;
-    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
-    render(): string | number | boolean | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | null | undefined;
-}
-//# sourceMappingURL=ThrownErrorBoundary.d.ts.map

package/dist/browser/components/ErrorBoundary/ThrownErrorBoundary.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ThrownErrorBoundary.d.ts","sourceRoot":"","sources":["../../../../src/components/ErrorBoundary/ThrownErrorBoundary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAqB,MAAM,4BAA4B,CAAA;AAC3E,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACvD,OAAO,OAAO,MAAM,SAAS,CAAA;AAI7B,MAAM,WAAW,wBAAwB;IACvC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,SAAS,CAAA;IACrE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,EAAE,WAAW,CAAA;CACvB;AAED,qBAAa,mBAAoB,SAAQ,SAAS,CAAC,wBAAwB,EAAE,wBAAwB,CAAC;IAC3F,KAAK,EAAE,wBAAwB,CAEvC;IAED,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,KAAK,GACwC,wBAAwB;IAG5G,MAAM,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,WAAW,GAAG,WAAW;IAOrD,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS;IAYpD,MAAM;CAYhB"}