@xyo-network/react-chain-network 1.20.1 → 1.20.2

package/dist/browser/context/ActiveGatewayProvider.d.ts

@@ -0,0 +1,8 @@
+import type { AccountInstance } from '@xyo-network/sdk-js';
+import type { PropsWithChildren } from 'react';
+import React from 'react';
+export interface ActiveGatewayProviderProps extends PropsWithChildren {
+    account?: AccountInstance;
+}
+export declare const ActiveGatewayProvider: React.FC<ActiveGatewayProviderProps>;
+//# sourceMappingURL=ActiveGatewayProvider.d.ts.map

package/dist/browser/context/ActiveGatewayProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActiveGatewayProvider.d.ts","sourceRoot":"","sources":["../../../src/context/ActiveGatewayProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAC1D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAC9C,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,0BAA2B,SAAQ,iBAAiB;IACnE,OAAO,CAAC,EAAE,eAAe,CAAA;CAC1B;AAED,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAOtE,CAAA"}

package/dist/browser/context/index.d.ts

@@ -1,2 +1,3 @@
+export * from './ActiveGatewayProvider.tsx';
 export * from './network/index.ts';
 //# sourceMappingURL=index.d.ts.map

package/dist/browser/context/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/context/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/context/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAA;AAC3C,cAAc,oBAAoB,CAAA"}

package/dist/browser/hooks/provider/useActiveNetworkCurrentBlock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useActiveNetworkCurrentBlock.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkCurrentBlock.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAA;AAIrD,eAAO,MAAM,4BAA4B,GAAI,gBAAW,EAAE,SAAS,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAI3E,CAAA;AAED,eAAO,MAAM,kCAAkC,GAAI,gBAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAK7D,CAAA;AAED,eAAO,MAAM,oCAAoC,GAAI,gBAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAK/D,CAAA"}
+{"version":3,"file":"useActiveNetworkCurrentBlock.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkCurrentBlock.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAA;AAKrD,eAAO,MAAM,4BAA4B,GAAI,gBAAW,EAAE,SAAS,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAI3E,CAAA;AAGD,eAAO,MAAM,kCAAkC,GAAI,gBAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAK7D,CAAA;AAED,eAAO,MAAM,oCAAoC,GAAI,gBAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iGAK/D,CAAA"}

package/dist/browser/hooks/provider/useActiveNetworkNetwork.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useActiveNetworkNetwork.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkNetwork.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,uBAAuB,4EAInC,CAAA"}
+{"version":3,"file":"useActiveNetworkNetwork.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkNetwork.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,uBAAuB,4EAInC,CAAA"}

package/dist/browser/hooks/provider/useActiveNetworkRunner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useActiveNetworkRunner.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkRunner.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,sBAAsB,6aAKlC,CAAA"}
+{"version":3,"file":"useActiveNetworkRunner.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkRunner.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,sBAAsB,6aAKlC,CAAA"}

package/dist/browser/hooks/provider/useViewerInPage.d.ts

@@ -4,4 +4,5 @@ import type { NetworkBootstrap } from '@xyo-network/xl1-sdk';
  * @returns - XyoViewer for the active network
  */
 export declare const useViewerInPage: (networkOverride?: NetworkBootstrap) => import("@xyo-network/xl1-sdk").XyoViewer | undefined;
+export declare const useViewerInPageV2: () => import("@xyo-network/xl1-sdk").XyoViewer | undefined;
 //# sourceMappingURL=useViewerInPage.d.ts.map

package/dist/browser/hooks/provider/useViewerInPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useViewerInPage.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useViewerInPage.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAW5D;;;GAGG;AACH,eAAO,MAAM,eAAe,GAAI,kBAAkB,gBAAgB,yDAsBjE,CAAA"}
+{"version":3,"file":"useViewerInPage.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useViewerInPage.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,gBAAgB,EAAa,MAAM,sBAAsB,CAAA;AAWvE;;;GAGG;AAEH,eAAO,MAAM,eAAe,GAAI,kBAAkB,gBAAgB,yDAsBjE,CAAA;AAED,eAAO,MAAM,iBAAiB,4DAuB7B,CAAA"}

package/dist/browser/hooks/provider/useViewerInWallet.d.ts

@@ -2,5 +2,6 @@
  * Get the viewer directly from the active network
  * @returns - The viewer for the active network
  */
+/** @deprecated use useViewerFromGateway in \@xyo-network/react-chain-provider */
 export declare const useViewerInWallet: () => import("@xyo-network/xl1-protocol").XyoViewer | undefined;
 //# sourceMappingURL=useViewerInWallet.d.ts.map

package/dist/browser/hooks/provider/useViewerInWallet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useViewerInWallet.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useViewerInWallet.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,iBAAiB,iEAI7B,CAAA"}
+{"version":3,"file":"useViewerInWallet.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useViewerInWallet.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,iFAAiF;AACjF,eAAO,MAAM,iBAAiB,iEAI7B,CAAA"}

package/dist/browser/index.mjs

@@ -3,14 +3,18 @@ var __name = (target, value) => __defProp(target, "name", { value, configurable:
 
 // src/components/broadcast/Drawer.tsx
 import { Box, Button, Drawer, Pagination, Stack as Stack3, Typography as Typography3 } from "@mui/material";
-import React5, { useState as useState7 } from "react";
+import React6, { useState as useState7 } from "react";
 
 // src/hooks/provider/useActiveNetworkCurrentBlock.ts
 import { useCurrentBlock, useViewerFromWallet as useViewerFromWallet2 } from "@xyo-network/react-chain-provider";
 
 // src/hooks/provider/useViewerInPage.ts
 import { isDefined as isDefined2, isNull, isUndefined } from "@xylabs/sdk-js";
-import { useHttpRpcViewer, useViewerFromWallet } from "@xyo-network/react-chain-provider";
+import { useHttpRpcViewer, useProvidedGateway, useViewerFromWallet } from "@xyo-network/react-chain-provider";
+
+// src/context/ActiveGatewayProvider.tsx
+import { GatewayProvider } from "@xyo-network/react-chain-provider";
+import React2 from "react";
 
 // src/context/network/context.ts
 import { createContextEx } from "@xylabs/react-shared";
@@ -115,9 +119,18 @@ var ChainNetworkProvider = /* @__PURE__ */ __name(({ children, getActiveNetwork,
 import { useContextEx } from "@xylabs/react-shared";
 var useChainNetwork = /* @__PURE__ */ __name((required = true) => useContextEx(ChainNetworkContext, "ChainNetwork", required), "useChainNetwork");
 
+// src/context/ActiveGatewayProvider.tsx
+var ActiveGatewayProvider = /* @__PURE__ */ __name(({ account, children }) => {
+  const { activeNetwork } = useChainNetwork();
+  return /* @__PURE__ */ React2.createElement(GatewayProvider, {
+    gatewayName: activeNetwork?.id,
+    account
+  }, children);
+}, "ActiveGatewayProvider");
+
 // src/hooks/provider/useViewerInPage.ts
-var shouldProxy = /* @__PURE__ */ __name((networkSettings, networkBootstrap) => {
-  return isDefined2(networkBootstrap) && isDefined2(networkSettings[networkBootstrap.id]) && networkSettings[networkBootstrap.id].proxy;
+var shouldProxy = /* @__PURE__ */ __name((networkSettings, networkId) => {
+  return isDefined2(networkId) && isDefined2(networkSettings[networkId]) && networkSettings[networkId].proxy;
 }, "shouldProxy");
 var useViewerInPage = /* @__PURE__ */ __name((networkOverride) => {
   let networkBootstrap;
@@ -126,7 +139,7 @@ var useViewerInPage = /* @__PURE__ */ __name((networkOverride) => {
   const httpRpcViewer = useHttpRpcViewer(networkBootstrap);
   const [walletRpcViewer] = useViewerFromWallet(networkBootstrap?.id);
   if (isUndefined(walletRpcViewer)) return;
-  if (shouldProxy(networkSettings, networkBootstrap)) {
+  if (shouldProxy(networkSettings, networkBootstrap?.id)) {
     if (isNull(walletRpcViewer)) {
       console.warn(`Network ${networkBootstrap?.id} is set to proxy but no wallet viewer is available, falling back to HTTP RPC viewer`);
       return httpRpcViewer;
@@ -135,6 +148,22 @@ var useViewerInPage = /* @__PURE__ */ __name((networkOverride) => {
   }
   return httpRpcViewer;
 }, "useViewerInPage");
+var useViewerInPageV2 = /* @__PURE__ */ __name(() => {
+  const { networkSettings, activeNetwork } = useChainNetwork();
+  const { gateways } = useProvidedGateway();
+  const { inPageGateway, walletGateway } = gateways;
+  const inPageViewer = inPageGateway?.connection?.viewer;
+  const walletViewer = walletGateway?.connection?.viewer;
+  if (isUndefined(walletGateway)) return;
+  if (shouldProxy(networkSettings, activeNetwork?.id)) {
+    if (isNull(walletGateway)) {
+      console.warn(`Network ${activeNetwork?.id} is set to proxy but no wallet viewer is available, falling back to HTTP RPC viewer`);
+      return inPageViewer;
+    }
+    return walletViewer;
+  }
+  return inPageViewer;
+}, "useViewerInPageV2");
 
 // src/hooks/provider/useActiveNetworkCurrentBlock.ts
 var useActiveNetworkCurrentBlock = /* @__PURE__ */ __name((refresh = 1, viewer) => {
@@ -259,7 +288,7 @@ var usePollNetworkStatus = /* @__PURE__ */ __name(() => {
           setNetworkStatus(response);
           setNetworkStatusError(void 0);
         } catch (error) {
-          console.error("Error fetching network status:", error);
+          console.info("Error fetching network status:", error);
           setNetworkStatus(void 0);
           setNetworkStatusError(error);
         }
@@ -281,9 +310,9 @@ var usePollNetworkStatus = /* @__PURE__ */ __name(() => {
 // src/components/broadcast/CloseDrawerIconButton.tsx
 import { Cancel } from "@mui/icons-material";
 import { IconButton } from "@mui/material";
-import React2 from "react";
+import React3 from "react";
 var CloseDrawerIconButton = /* @__PURE__ */ __name(({ anchor, onClose }) => {
-  return /* @__PURE__ */ React2.createElement(IconButton, {
+  return /* @__PURE__ */ React3.createElement(IconButton, {
     onClick: /* @__PURE__ */ __name((e) => onClose?.(e, "backdropClick"), "onClick"),
     size: "small",
     sx: {
@@ -292,7 +321,7 @@ var CloseDrawerIconButton = /* @__PURE__ */ __name(({ anchor, onClose }) => {
       right: anchor === "right" ? void 0 : 8,
       left: anchor === "left" ? void 0 : 8
     }
-  }, /* @__PURE__ */ React2.createElement(Cancel, {
+  }, /* @__PURE__ */ React3.createElement(Cancel, {
     fontSize: "small"
   }));
 }, "CloseDrawerIconButton");
@@ -301,7 +330,7 @@ var CloseDrawerIconButton = /* @__PURE__ */ __name(({ anchor, onClose }) => {
 import { Card, Collapse, Stack as Stack2, Typography as Typography2 } from "@mui/material";
 import { isDefined as isDefined5 } from "@xylabs/sdk-js";
 import { JsonViewerEx } from "@xyo-network/react-payload-raw-info";
-import React4, { memo, useState as useState5 } from "react";
+import React5, { memo, useState as useState5 } from "react";
 
 // src/components/broadcast/details/SummaryStack.tsx
 import { ArrowRight, CheckCircle, Warning } from "@mui/icons-material";
@@ -310,7 +339,7 @@ import { Identicon } from "@xylabs/react-identicon";
 import { usePromise as usePromise2 } from "@xylabs/react-promise";
 import { isDefined as isDefined4 } from "@xylabs/sdk-js";
 import { ObjectHasher } from "@xyo-network/hash";
-import React3 from "react";
+import React4 from "react";
 var BroadcastedRpcCallDetailsSummaryStack = /* @__PURE__ */ __name(({ expanded, setExpanded, method, timestamp, hasResult, params, ...props }) => {
   const theme = useTheme();
   const [hash, hashError] = usePromise2(async () => {
@@ -320,55 +349,55 @@ var BroadcastedRpcCallDetailsSummaryStack = /* @__PURE__ */ __name(({ expanded,
   }, [
     params
   ]);
-  return /* @__PURE__ */ React3.createElement(Stack, {
+  return /* @__PURE__ */ React4.createElement(Stack, {
     direction: "row",
     gap: 2,
     alignItems: "center",
     justifyContent: "space-between",
     ...props
-  }, /* @__PURE__ */ React3.createElement(Stack, {
+  }, /* @__PURE__ */ React4.createElement(Stack, {
     direction: "row",
     gap: 2,
     alignItems: "center"
-  }, /* @__PURE__ */ React3.createElement(IconButton2, {
+  }, /* @__PURE__ */ React4.createElement(IconButton2, {
     size: "small",
     onClick: /* @__PURE__ */ __name(() => setExpanded?.(!expanded), "onClick")
-  }, /* @__PURE__ */ React3.createElement(ArrowRight, {
+  }, /* @__PURE__ */ React4.createElement(ArrowRight, {
     sx: {
       transform: expanded ? "rotate(90deg)" : "rotate(0deg)",
       transition: "transform 0.2s ease-in-out"
     },
     fontSize: "small"
-  })), /* @__PURE__ */ React3.createElement(Tooltip, {
+  })), /* @__PURE__ */ React4.createElement(Tooltip, {
     title: isDefined4(hashError) ? `Error generating hash of params: ${hashError.message}` : isDefined4(params) ? `Params : ${JSON.stringify(params, null, 2)}` : "No Params Provided"
-  }, /* @__PURE__ */ React3.createElement(Avatar, {
+  }, /* @__PURE__ */ React4.createElement(Avatar, {
     sx: {
       backgroundColor: theme.vars?.palette.text.primary,
       width: 20,
       height: 20,
       opacity: isDefined4(hash) ? 1 : 0.5
     }
-  }, /* @__PURE__ */ React3.createElement(Identicon, {
+  }, /* @__PURE__ */ React4.createElement(Identicon, {
     value: hash,
     size: 14
-  }))), /* @__PURE__ */ React3.createElement(Typography, {
+  }))), /* @__PURE__ */ React4.createElement(Typography, {
     component: "span",
     variant: "body2",
     fontFamily: "monospace"
-  }, method), /* @__PURE__ */ React3.createElement(Typography, {
+  }, method), /* @__PURE__ */ React4.createElement(Typography, {
     component: "span",
     variant: "caption",
     color: "text.secondary",
     sx: {
       opacity: 0.6
     }
-  }, isDefined4(timestamp) ? new Date(timestamp).toLocaleString() : "")), /* @__PURE__ */ React3.createElement(Icon, {
+  }, isDefined4(timestamp) ? new Date(timestamp).toLocaleString() : "")), /* @__PURE__ */ React4.createElement(Icon, {
     sx: {
       justifySelf: "end"
     }
-  }, hasResult ? /* @__PURE__ */ React3.createElement(CheckCircle, {
+  }, hasResult ? /* @__PURE__ */ React4.createElement(CheckCircle, {
     color: "success"
-  }) : /* @__PURE__ */ React3.createElement(Warning, {
+  }) : /* @__PURE__ */ React4.createElement(Warning, {
     color: "warning"
   })));
 }, "BroadcastedRpcCallDetailsSummaryStack");
@@ -379,7 +408,7 @@ var BroadcastedRpcCallDetailsCard = /* @__PURE__ */ memo(({ rpcRequestResponsePa
   const [expanded, setExpanded] = useState5(false);
   if (!rpcRequestResponsePairs) return null;
   const { request, result, source } = rpcRequestResponsePairs;
-  return /* @__PURE__ */ React4.createElement(Card, {
+  return /* @__PURE__ */ React5.createElement(Card, {
     sx: {
       p: 1,
       display: "flex",
@@ -388,42 +417,42 @@ var BroadcastedRpcCallDetailsCard = /* @__PURE__ */ memo(({ rpcRequestResponsePa
       ...sx
     },
     ...props
-  }, /* @__PURE__ */ React4.createElement(BroadcastedRpcCallDetailsSummaryStack, {
+  }, /* @__PURE__ */ React5.createElement(BroadcastedRpcCallDetailsSummaryStack, {
     expanded,
     params: request.rpcCall.params,
     hasResult: isDefined5(result),
     method: request.rpcCall.method,
     setExpanded,
     timestamp: request.timestamp
-  }), /* @__PURE__ */ React4.createElement(Collapse, {
+  }), /* @__PURE__ */ React5.createElement(Collapse, {
     in: expanded,
     mountOnEnter: true,
     unmountOnExit: true
-  }, /* @__PURE__ */ React4.createElement(Stack2, {
+  }, /* @__PURE__ */ React5.createElement(Stack2, {
     direction: "column",
     p: 1,
     gap: 2,
     alignItems: "stretch"
-  }, /* @__PURE__ */ React4.createElement(Typography2, {
+  }, /* @__PURE__ */ React5.createElement(Typography2, {
     variant: "body2"
-  }, "Source:", /* @__PURE__ */ React4.createElement(Typography2, {
+  }, "Source:", /* @__PURE__ */ React5.createElement(Typography2, {
     variant: "caption",
     component: "span",
     fontFamily: "monospace",
     sx: {
       ml: 1
     }
-  }, source)), /* @__PURE__ */ React4.createElement(Typography2, {
+  }, source)), /* @__PURE__ */ React5.createElement(Typography2, {
     variant: "body2"
-  }, "Request:"), /* @__PURE__ */ React4.createElement(JsonViewerEx, {
+  }, "Request:"), /* @__PURE__ */ React5.createElement(JsonViewerEx, {
     value: request,
     sx: {
       maxHeight: 300,
       overflow: "auto"
     }
-  }), isDefined5(result) ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(Typography2, {
+  }), isDefined5(result) ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(Typography2, {
     variant: "body2"
-  }, "Result:"), /* @__PURE__ */ React4.createElement(JsonViewerEx, {
+  }, "Result:"), /* @__PURE__ */ React5.createElement(JsonViewerEx, {
     value: result,
     sx: {
       maxHeight: 300,
@@ -504,44 +533,44 @@ var usePaginatedEventPairs = /* @__PURE__ */ __name((formattedEvents, numberOfVi
 var BroadcastedRpcCallsDrawer = /* @__PURE__ */ __name(({ anchor = "right", onClearEvents, drawerTitle, events, onClose, numberOfVisibleEvents = 25, ...props }) => {
   const [scrollableDiv, setScrollableDiv] = useState7(null);
   const { allEventEntries, visibleEvents, totalPages, effectiveCurrentPage, handleClearEvents, handlePageChange } = usePaginatedEventPairs(events, numberOfVisibleEvents, onClearEvents, scrollableDiv);
-  return /* @__PURE__ */ React5.createElement(Drawer, {
+  return /* @__PURE__ */ React6.createElement(Drawer, {
     anchor,
     onClose,
     keepMounted: false,
     ...props
-  }, /* @__PURE__ */ React5.createElement(CloseDrawerIconButton, {
+  }, /* @__PURE__ */ React6.createElement(CloseDrawerIconButton, {
     anchor,
     onClose
-  }), /* @__PURE__ */ React5.createElement(Stack3, {
+  }), /* @__PURE__ */ React6.createElement(Stack3, {
     gap: 2,
     sx: {
       p: 3
     },
     flexShrink: 0
-  }, /* @__PURE__ */ React5.createElement(Stack3, {
+  }, /* @__PURE__ */ React6.createElement(Stack3, {
     direction: "row",
     justifyContent: "space-between",
     alignItems: "center",
     gap: 4
-  }, /* @__PURE__ */ React5.createElement(Typography3, {
+  }, /* @__PURE__ */ React6.createElement(Typography3, {
     variant: "h6"
-  }, drawerTitle ?? "Broadcasted RPC Calls"), /* @__PURE__ */ React5.createElement(Button, {
+  }, drawerTitle ?? "Broadcasted RPC Calls"), /* @__PURE__ */ React6.createElement(Button, {
     variant: "outlined",
     size: "small",
     onClick: handleClearEvents
-  }, "Clear All")), allEventEntries.length > 0 && /* @__PURE__ */ React5.createElement(Pagination, {
+  }, "Clear All")), allEventEntries.length > 0 && /* @__PURE__ */ React6.createElement(Pagination, {
     count: totalPages,
     page: effectiveCurrentPage,
     onChange: handlePageChange,
     color: "primary"
-  })), /* @__PURE__ */ React5.createElement(Stack3, {
+  })), /* @__PURE__ */ React6.createElement(Stack3, {
     direction: "column",
     id: "events-container",
     flexGrow: 1,
     sx: {
       overflowY: "hidden"
     }
-  }, /* @__PURE__ */ React5.createElement(Box, {
+  }, /* @__PURE__ */ React6.createElement(Box, {
     ref: /* @__PURE__ */ __name((el) => setScrollableDiv(el), "ref"),
     sx: {
       overflowY: "auto",
@@ -549,7 +578,7 @@ var BroadcastedRpcCallsDrawer = /* @__PURE__ */ __name(({ anchor = "right", onCl
       pb: 3
     }
   }, visibleEvents.map(([id, broadcastedRpcCall], index) => {
-    return /* @__PURE__ */ React5.createElement(BroadcastedRpcCallDetailsCard, {
+    return /* @__PURE__ */ React6.createElement(BroadcastedRpcCallDetailsCard, {
       key: id,
       rpcRequestResponsePairs: broadcastedRpcCall,
       sx: {
@@ -560,7 +589,7 @@ var BroadcastedRpcCallsDrawer = /* @__PURE__ */ __name(({ anchor = "right", onCl
 }, "BroadcastedRpcCallsDrawer");
 var BroadcastedRpcCallsDrawerWithEvents = /* @__PURE__ */ __name((props) => {
   const { clearEvents, events } = useRpcBroadcastListener();
-  return /* @__PURE__ */ React5.createElement(BroadcastedRpcCallsDrawer, {
+  return /* @__PURE__ */ React6.createElement(BroadcastedRpcCallsDrawer, {
     events,
     onClearEvents: clearEvents,
     ...props
@@ -569,12 +598,12 @@ var BroadcastedRpcCallsDrawerWithEvents = /* @__PURE__ */ __name((props) => {
 
 // src/components/menu/Avatar.tsx
 import { Avatar as Avatar2 } from "@mui/material";
-import React7 from "react";
+import React8 from "react";
 
 // src/components/menu/Icon.tsx
-import React6 from "react";
+import React7 from "react";
 var NetworkIcon = /* @__PURE__ */ __name(({ icon, style, ...props }) => {
-  return /* @__PURE__ */ React6.createElement("span", {
+  return /* @__PURE__ */ React7.createElement("span", {
     // eslint-disable-next-line react-dom/no-dangerously-set-innerhtml
     dangerouslySetInnerHTML: {
       __html: icon ?? ""
@@ -591,14 +620,14 @@ var NetworkIcon = /* @__PURE__ */ __name(({ icon, style, ...props }) => {
 
 // src/components/menu/Avatar.tsx
 var NetworkAvatar = /* @__PURE__ */ __name(({ icon, iconStyles, name, sx, ...props }) => {
-  return /* @__PURE__ */ React7.createElement(Avatar2, {
+  return /* @__PURE__ */ React8.createElement(Avatar2, {
     sx: {
       backgroundColor: "white",
       ...sx
     },
     alt: name,
     ...props
-  }, /* @__PURE__ */ React7.createElement(NetworkIcon, {
+  }, /* @__PURE__ */ React8.createElement(NetworkIcon, {
     icon,
     style: {
       ...iconStyles
@@ -607,7 +636,7 @@ var NetworkAvatar = /* @__PURE__ */ __name(({ icon, iconStyles, name, sx, ...pro
 }, "NetworkAvatar");
 var ActiveNetworkAvatar = /* @__PURE__ */ __name((props) => {
   const { activeNetwork } = useChainNetwork();
-  return /* @__PURE__ */ React7.createElement(NetworkAvatar, {
+  return /* @__PURE__ */ React8.createElement(NetworkAvatar, {
     icon: activeNetwork?.icon,
     name: activeNetwork?.name,
     ...props
@@ -617,14 +646,14 @@ var ActiveNetworkAvatar = /* @__PURE__ */ __name((props) => {
 // src/components/menu/MenuItem.tsx
 import { ListItemText } from "@mui/material";
 import { ActiveMenuItem } from "@xyo-network/react-chain-shared";
-import React8 from "react";
+import React9 from "react";
 var NetworkMenuItem = /* @__PURE__ */ __name(({ active, network, onClick, updateActiveNetwork, ...props }) => {
   const handleClick = /* @__PURE__ */ __name((event) => {
     if (network === void 0) throw new Error("Network is undefined");
     updateActiveNetwork?.(network.id);
     onClick?.(event);
   }, "handleClick");
-  return /* @__PURE__ */ React8.createElement(ActiveMenuItem, {
+  return /* @__PURE__ */ React9.createElement(ActiveMenuItem, {
     title: network?.name,
     disableRipple: true,
     onClick: handleClick,
@@ -633,38 +662,38 @@ var NetworkMenuItem = /* @__PURE__ */ __name(({ active, network, onClick, update
       py: 1
     },
     ...props
-  }, /* @__PURE__ */ React8.createElement(NetworkAvatar, {
+  }, /* @__PURE__ */ React9.createElement(NetworkAvatar, {
     icon: network?.icon,
     name: network?.name,
     sx: {
       width: 30,
       height: 30
     }
-  }), /* @__PURE__ */ React8.createElement(ListItemText, null, network?.name));
+  }), /* @__PURE__ */ React9.createElement(ListItemText, null, network?.name));
 }, "NetworkMenuItem");
 
 // src/components/status/Alert.tsx
 import { Alert, AlertTitle, Button as Button3 } from "@mui/material";
-import React10, { useMemo as useMemo3, useState as useState8 } from "react";
+import React11, { useMemo as useMemo3, useState as useState8 } from "react";
 
 // src/components/status/Dialog.tsx
 import { Button as Button2, Dialog, DialogActions, DialogContent, DialogTitle, List, ListItem, Typography as Typography4 } from "@mui/material";
-import React9 from "react";
+import React10 from "react";
 var NetworkStatusDialog = /* @__PURE__ */ __name(({ updates, ...props }) => {
-  return /* @__PURE__ */ React9.createElement(Dialog, props, /* @__PURE__ */ React9.createElement(DialogTitle, null, "Recent Status Updates"), /* @__PURE__ */ React9.createElement(DialogContent, null, /* @__PURE__ */ React9.createElement(List, null, updates.map(({ start, end, update }) => /* @__PURE__ */ React9.createElement(ListItem, {
+  return /* @__PURE__ */ React10.createElement(Dialog, props, /* @__PURE__ */ React10.createElement(DialogTitle, null, "Recent Status Updates"), /* @__PURE__ */ React10.createElement(DialogContent, null, /* @__PURE__ */ React10.createElement(List, null, updates.map(({ start, end, update }) => /* @__PURE__ */ React10.createElement(ListItem, {
     key: start + update,
     sx: {
       flexDirection: "column",
       alignItems: "start",
       pl: 0
     }
-  }, /* @__PURE__ */ React9.createElement(Typography4, null, update), /* @__PURE__ */ React9.createElement(Typography4, {
+  }, /* @__PURE__ */ React10.createElement(Typography4, null, update), /* @__PURE__ */ React10.createElement(Typography4, {
     gutterBottom: true,
     sx: {
       opacity: 0.75,
       fontSize: ".8333rem"
     }
-  }, "Start:", " ", new Date(start).toLocaleString(), " ", /* @__PURE__ */ React9.createElement("br", null), "End:", " ", new Date(end).toLocaleString()))))), /* @__PURE__ */ React9.createElement(DialogActions, null, /* @__PURE__ */ React9.createElement(Button2, {
+  }, "Start:", " ", new Date(start).toLocaleString(), " ", /* @__PURE__ */ React10.createElement("br", null), "End:", " ", new Date(end).toLocaleString()))))), /* @__PURE__ */ React10.createElement(DialogActions, null, /* @__PURE__ */ React10.createElement(Button2, {
     onClick: /* @__PURE__ */ __name((e) => props.onClose?.(e, "backdropClick"), "onClick"),
     color: "primary",
     variant: "outlined"
@@ -694,15 +723,15 @@ var NetworkStatusAlert = /* @__PURE__ */ __name(({ status, ...props }) => {
   }, [
     status
   ]);
-  return /* @__PURE__ */ React10.createElement(Alert, {
+  return /* @__PURE__ */ React11.createElement(Alert, {
     severity,
     ...props
-  }, /* @__PURE__ */ React10.createElement(AlertTitle, null, status?.description), status?.updates && status.updates.length > 0 ? /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement(Button3, {
+  }, /* @__PURE__ */ React11.createElement(AlertTitle, null, status?.description), status?.updates && status.updates.length > 0 ? /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(Button3, {
     color: severity,
     variant: "outlined",
     size: "small",
     onClick: /* @__PURE__ */ __name(() => setOpen(true), "onClick")
-  }, "Updates"), /* @__PURE__ */ React10.createElement(NetworkStatusDialog, {
+  }, "Updates"), /* @__PURE__ */ React11.createElement(NetworkStatusDialog, {
     open,
     onClose: handleClose,
     updates: status.updates
@@ -710,7 +739,7 @@ var NetworkStatusAlert = /* @__PURE__ */ __name(({ status, ...props }) => {
 }, "NetworkStatusAlert");
 
 // src/components/status/NetworkStatus.tsx
-import React11 from "react";
+import React12 from "react";
 var validNetworkStates = /* @__PURE__ */ new Set([
   "online",
   "unknown"
@@ -718,7 +747,7 @@ var validNetworkStates = /* @__PURE__ */ new Set([
 var NetworkStatus = /* @__PURE__ */ __name(({ children, ...props }) => {
   const [networkStatus] = usePollNetworkStatus();
   const showStatus = networkStatus && !validNetworkStates.has(networkStatus.state);
-  return /* @__PURE__ */ React11.createElement(React11.Fragment, null, showStatus ? /* @__PURE__ */ React11.createElement(NetworkStatusAlert, {
+  return /* @__PURE__ */ React12.createElement(React12.Fragment, null, showStatus ? /* @__PURE__ */ React12.createElement(NetworkStatusAlert, {
     status: networkStatus,
     ...props
   }) : null, children);
@@ -732,6 +761,7 @@ var defaultBroadcastConfig = {
   response: true
 };
 export {
+  ActiveGatewayProvider,
   ActiveNetworkAvatar,
   BroadcastRpcRequestEventName,
   BroadcastRpcResponseEventName,
@@ -756,6 +786,7 @@ export {
   usePollNetworkStatus,
   useRpcBroadcastListener,
   useViewerInPage,
+  useViewerInPageV2,
   useViewerInWallet
 };
 //# sourceMappingURL=index.mjs.map