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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/browser/context/ActiveGatewayProvider.d.ts +8 -0
  2. package/dist/browser/context/ActiveGatewayProvider.d.ts.map +1 -0
  3. package/dist/browser/context/index.d.ts +1 -0
  4. package/dist/browser/context/index.d.ts.map +1 -1
  5. package/dist/browser/hooks/provider/useActiveNetworkCurrentBlock.d.ts.map +1 -1
  6. package/dist/browser/hooks/provider/useActiveNetworkNetwork.d.ts.map +1 -1
  7. package/dist/browser/hooks/provider/useActiveNetworkRunner.d.ts.map +1 -1
  8. package/dist/browser/hooks/provider/useViewerInPage.d.ts +1 -0
  9. package/dist/browser/hooks/provider/useViewerInPage.d.ts.map +1 -1
  10. package/dist/browser/hooks/provider/useViewerInWallet.d.ts +1 -0
  11. package/dist/browser/hooks/provider/useViewerInWallet.d.ts.map +1 -1
  12. package/dist/browser/index.mjs +96 -64
  13. package/dist/browser/index.mjs.map +1 -1
  14. package/package.json +19 -19
  15. package/src/context/ActiveGatewayProvider.tsx +21 -0
  16. package/src/context/index.ts +1 -0
  17. package/src/hooks/provider/UseViewerInPage.stories.tsx +5 -24
  18. package/src/hooks/provider/UseViewerInPageV2.stories.tsx +135 -0
  19. package/src/hooks/provider/useActiveNetworkCurrentBlock.ts +2 -0
  20. package/src/hooks/provider/useActiveNetworkNetwork.ts +1 -0
  21. package/src/hooks/provider/useActiveNetworkRunner.ts +1 -0
  22. package/src/hooks/provider/useViewerInPage.ts +35 -7
  23. package/src/hooks/provider/useViewerInWallet.ts +1 -0
  24. package/src/hooks/status/usePollNetworkStatus.ts +1 -1
  25. package/dist/browser/components/broadcast/details/SummaryStack.stories.d.ts +0 -8
  26. package/dist/browser/components/broadcast/details/SummaryStack.stories.d.ts.map +0 -1
  27. package/dist/browser/components/status/Alert.stories.d.ts +0 -10
  28. package/dist/browser/components/status/Alert.stories.d.ts.map +0 -1
  29. package/dist/browser/hooks/provider/UseViewerInPage.stories.d.ts +0 -10
  30. package/dist/browser/hooks/provider/UseViewerInPage.stories.d.ts.map +0 -1
@@ -0,0 +1,8 @@
1
+ import type { AccountInstance } from '@xyo-network/sdk-js';
2
+ import type { PropsWithChildren } from 'react';
3
+ import React from 'react';
4
+ export interface ActiveGatewayProviderProps extends PropsWithChildren {
5
+ account?: AccountInstance;
6
+ }
7
+ export declare const ActiveGatewayProvider: React.FC<ActiveGatewayProviderProps>;
8
+ //# sourceMappingURL=ActiveGatewayProvider.d.ts.map
@@ -0,0 +1 @@
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,CAStE,CAAA"}
@@ -1,2 +1,3 @@
1
+ export * from './ActiveGatewayProvider.tsx';
1
2
  export * from './network/index.ts';
2
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/context/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/context/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAA;AAC3C,cAAc,oBAAoB,CAAA"}
@@ -1 +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"}
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;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"}
@@ -1 +1 @@
1
- {"version":3,"file":"useActiveNetworkNetwork.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkNetwork.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,uBAAuB,4EAInC,CAAA"}
1
+ {"version":3,"file":"useActiveNetworkNetwork.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkNetwork.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,uBAAuB,4EAInC,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"useActiveNetworkRunner.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkRunner.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,sBAAsB,6aAKlC,CAAA"}
1
+ {"version":3,"file":"useActiveNetworkRunner.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useActiveNetworkRunner.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,sBAAsB,6aAKlC,CAAA"}
@@ -4,4 +4,5 @@ import type { NetworkBootstrap } from '@xyo-network/xl1-sdk';
4
4
  * @returns - XyoViewer for the active network
5
5
  */
6
6
  export declare const useViewerInPage: (networkOverride?: NetworkBootstrap) => import("@xyo-network/xl1-sdk").XyoViewer | undefined;
7
+ export declare const useViewerInPageV2: () => import("@xyo-network/xl1-sdk").XyoViewer | undefined;
7
8
  //# sourceMappingURL=useViewerInPage.d.ts.map
@@ -1 +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"}
1
+ {"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"}
@@ -2,5 +2,6 @@
2
2
  * Get the viewer directly from the active network
3
3
  * @returns - The viewer for the active network
4
4
  */
5
+ /** @deprecated use useViewerFromGateway in \@xyo-network/react-chain-provider */
5
6
  export declare const useViewerInWallet: () => import("@xyo-network/xl1-protocol").XyoViewer | undefined;
6
7
  //# sourceMappingURL=useViewerInWallet.d.ts.map
@@ -1 +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"}
1
+ {"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"}
@@ -3,14 +3,18 @@ var __name = (target, value) => __defProp(target, "name", { value, configurable:
3
3
 
4
4
  // src/components/broadcast/Drawer.tsx
5
5
  import { Box, Button, Drawer, Pagination, Stack as Stack3, Typography as Typography3 } from "@mui/material";
6
- import React5, { useState as useState7 } from "react";
6
+ import React6, { useState as useState7 } from "react";
7
7
 
8
8
  // src/hooks/provider/useActiveNetworkCurrentBlock.ts
9
9
  import { useCurrentBlock, useViewerFromWallet as useViewerFromWallet2 } from "@xyo-network/react-chain-provider";
10
10
 
11
11
  // src/hooks/provider/useViewerInPage.ts
12
12
  import { isDefined as isDefined2, isNull, isUndefined } from "@xylabs/sdk-js";
13
- import { useHttpRpcViewer, useViewerFromWallet } from "@xyo-network/react-chain-provider";
13
+ import { useHttpRpcViewer, useProvidedGateway, useViewerFromWallet } from "@xyo-network/react-chain-provider";
14
+
15
+ // src/context/ActiveGatewayProvider.tsx
16
+ import { GatewayProvider, InPageGatewaysProvider } from "@xyo-network/react-chain-provider";
17
+ import React2 from "react";
14
18
 
15
19
  // src/context/network/context.ts
16
20
  import { createContextEx } from "@xylabs/react-shared";
@@ -115,9 +119,19 @@ var ChainNetworkProvider = /* @__PURE__ */ __name(({ children, getActiveNetwork,
115
119
  import { useContextEx } from "@xylabs/react-shared";
116
120
  var useChainNetwork = /* @__PURE__ */ __name((required = true) => useContextEx(ChainNetworkContext, "ChainNetwork", required), "useChainNetwork");
117
121
 
122
+ // src/context/ActiveGatewayProvider.tsx
123
+ var ActiveGatewayProvider = /* @__PURE__ */ __name(({ account, children }) => {
124
+ const { activeNetwork } = useChainNetwork();
125
+ return /* @__PURE__ */ React2.createElement(InPageGatewaysProvider, {
126
+ account
127
+ }, /* @__PURE__ */ React2.createElement(GatewayProvider, {
128
+ gatewayName: activeNetwork?.id
129
+ }, children));
130
+ }, "ActiveGatewayProvider");
131
+
118
132
  // src/hooks/provider/useViewerInPage.ts
119
- var shouldProxy = /* @__PURE__ */ __name((networkSettings, networkBootstrap) => {
120
- return isDefined2(networkBootstrap) && isDefined2(networkSettings[networkBootstrap.id]) && networkSettings[networkBootstrap.id].proxy;
133
+ var shouldProxy = /* @__PURE__ */ __name((networkSettings, networkId) => {
134
+ return isDefined2(networkId) && isDefined2(networkSettings[networkId]) && networkSettings[networkId].proxy;
121
135
  }, "shouldProxy");
122
136
  var useViewerInPage = /* @__PURE__ */ __name((networkOverride) => {
123
137
  let networkBootstrap;
@@ -126,7 +140,7 @@ var useViewerInPage = /* @__PURE__ */ __name((networkOverride) => {
126
140
  const httpRpcViewer = useHttpRpcViewer(networkBootstrap);
127
141
  const [walletRpcViewer] = useViewerFromWallet(networkBootstrap?.id);
128
142
  if (isUndefined(walletRpcViewer)) return;
129
- if (shouldProxy(networkSettings, networkBootstrap)) {
143
+ if (shouldProxy(networkSettings, networkBootstrap?.id)) {
130
144
  if (isNull(walletRpcViewer)) {
131
145
  console.warn(`Network ${networkBootstrap?.id} is set to proxy but no wallet viewer is available, falling back to HTTP RPC viewer`);
132
146
  return httpRpcViewer;
@@ -135,6 +149,22 @@ var useViewerInPage = /* @__PURE__ */ __name((networkOverride) => {
135
149
  }
136
150
  return httpRpcViewer;
137
151
  }, "useViewerInPage");
152
+ var useViewerInPageV2 = /* @__PURE__ */ __name(() => {
153
+ const { networkSettings, activeNetwork } = useChainNetwork();
154
+ const { gateways } = useProvidedGateway();
155
+ const { inPageGateway, walletGateway } = gateways;
156
+ const inPageViewer = inPageGateway?.connection?.viewer;
157
+ const walletViewer = walletGateway?.connection?.viewer;
158
+ if (isUndefined(walletGateway)) return;
159
+ if (shouldProxy(networkSettings, activeNetwork?.id)) {
160
+ if (isNull(walletGateway)) {
161
+ console.warn(`Network ${activeNetwork?.id} is set to proxy but no wallet viewer is available, falling back to HTTP RPC viewer`);
162
+ return inPageViewer;
163
+ }
164
+ return walletViewer;
165
+ }
166
+ return inPageViewer;
167
+ }, "useViewerInPageV2");
138
168
 
139
169
  // src/hooks/provider/useActiveNetworkCurrentBlock.ts
140
170
  var useActiveNetworkCurrentBlock = /* @__PURE__ */ __name((refresh = 1, viewer) => {
@@ -259,7 +289,7 @@ var usePollNetworkStatus = /* @__PURE__ */ __name(() => {
259
289
  setNetworkStatus(response);
260
290
  setNetworkStatusError(void 0);
261
291
  } catch (error) {
262
- console.error("Error fetching network status:", error);
292
+ console.info("Error fetching network status:", error);
263
293
  setNetworkStatus(void 0);
264
294
  setNetworkStatusError(error);
265
295
  }
@@ -281,9 +311,9 @@ var usePollNetworkStatus = /* @__PURE__ */ __name(() => {
281
311
  // src/components/broadcast/CloseDrawerIconButton.tsx
282
312
  import { Cancel } from "@mui/icons-material";
283
313
  import { IconButton } from "@mui/material";
284
- import React2 from "react";
314
+ import React3 from "react";
285
315
  var CloseDrawerIconButton = /* @__PURE__ */ __name(({ anchor, onClose }) => {
286
- return /* @__PURE__ */ React2.createElement(IconButton, {
316
+ return /* @__PURE__ */ React3.createElement(IconButton, {
287
317
  onClick: /* @__PURE__ */ __name((e) => onClose?.(e, "backdropClick"), "onClick"),
288
318
  size: "small",
289
319
  sx: {
@@ -292,7 +322,7 @@ var CloseDrawerIconButton = /* @__PURE__ */ __name(({ anchor, onClose }) => {
292
322
  right: anchor === "right" ? void 0 : 8,
293
323
  left: anchor === "left" ? void 0 : 8
294
324
  }
295
- }, /* @__PURE__ */ React2.createElement(Cancel, {
325
+ }, /* @__PURE__ */ React3.createElement(Cancel, {
296
326
  fontSize: "small"
297
327
  }));
298
328
  }, "CloseDrawerIconButton");
@@ -301,7 +331,7 @@ var CloseDrawerIconButton = /* @__PURE__ */ __name(({ anchor, onClose }) => {
301
331
  import { Card, Collapse, Stack as Stack2, Typography as Typography2 } from "@mui/material";
302
332
  import { isDefined as isDefined5 } from "@xylabs/sdk-js";
303
333
  import { JsonViewerEx } from "@xyo-network/react-payload-raw-info";
304
- import React4, { memo, useState as useState5 } from "react";
334
+ import React5, { memo, useState as useState5 } from "react";
305
335
 
306
336
  // src/components/broadcast/details/SummaryStack.tsx
307
337
  import { ArrowRight, CheckCircle, Warning } from "@mui/icons-material";
@@ -310,7 +340,7 @@ import { Identicon } from "@xylabs/react-identicon";
310
340
  import { usePromise as usePromise2 } from "@xylabs/react-promise";
311
341
  import { isDefined as isDefined4 } from "@xylabs/sdk-js";
312
342
  import { ObjectHasher } from "@xyo-network/hash";
313
- import React3 from "react";
343
+ import React4 from "react";
314
344
  var BroadcastedRpcCallDetailsSummaryStack = /* @__PURE__ */ __name(({ expanded, setExpanded, method, timestamp, hasResult, params, ...props }) => {
315
345
  const theme = useTheme();
316
346
  const [hash, hashError] = usePromise2(async () => {
@@ -320,55 +350,55 @@ var BroadcastedRpcCallDetailsSummaryStack = /* @__PURE__ */ __name(({ expanded,
320
350
  }, [
321
351
  params
322
352
  ]);
323
- return /* @__PURE__ */ React3.createElement(Stack, {
353
+ return /* @__PURE__ */ React4.createElement(Stack, {
324
354
  direction: "row",
325
355
  gap: 2,
326
356
  alignItems: "center",
327
357
  justifyContent: "space-between",
328
358
  ...props
329
- }, /* @__PURE__ */ React3.createElement(Stack, {
359
+ }, /* @__PURE__ */ React4.createElement(Stack, {
330
360
  direction: "row",
331
361
  gap: 2,
332
362
  alignItems: "center"
333
- }, /* @__PURE__ */ React3.createElement(IconButton2, {
363
+ }, /* @__PURE__ */ React4.createElement(IconButton2, {
334
364
  size: "small",
335
365
  onClick: /* @__PURE__ */ __name(() => setExpanded?.(!expanded), "onClick")
336
- }, /* @__PURE__ */ React3.createElement(ArrowRight, {
366
+ }, /* @__PURE__ */ React4.createElement(ArrowRight, {
337
367
  sx: {
338
368
  transform: expanded ? "rotate(90deg)" : "rotate(0deg)",
339
369
  transition: "transform 0.2s ease-in-out"
340
370
  },
341
371
  fontSize: "small"
342
- })), /* @__PURE__ */ React3.createElement(Tooltip, {
372
+ })), /* @__PURE__ */ React4.createElement(Tooltip, {
343
373
  title: isDefined4(hashError) ? `Error generating hash of params: ${hashError.message}` : isDefined4(params) ? `Params : ${JSON.stringify(params, null, 2)}` : "No Params Provided"
344
- }, /* @__PURE__ */ React3.createElement(Avatar, {
374
+ }, /* @__PURE__ */ React4.createElement(Avatar, {
345
375
  sx: {
346
376
  backgroundColor: theme.vars?.palette.text.primary,
347
377
  width: 20,
348
378
  height: 20,
349
379
  opacity: isDefined4(hash) ? 1 : 0.5
350
380
  }
351
- }, /* @__PURE__ */ React3.createElement(Identicon, {
381
+ }, /* @__PURE__ */ React4.createElement(Identicon, {
352
382
  value: hash,
353
383
  size: 14
354
- }))), /* @__PURE__ */ React3.createElement(Typography, {
384
+ }))), /* @__PURE__ */ React4.createElement(Typography, {
355
385
  component: "span",
356
386
  variant: "body2",
357
387
  fontFamily: "monospace"
358
- }, method), /* @__PURE__ */ React3.createElement(Typography, {
388
+ }, method), /* @__PURE__ */ React4.createElement(Typography, {
359
389
  component: "span",
360
390
  variant: "caption",
361
391
  color: "text.secondary",
362
392
  sx: {
363
393
  opacity: 0.6
364
394
  }
365
- }, isDefined4(timestamp) ? new Date(timestamp).toLocaleString() : "")), /* @__PURE__ */ React3.createElement(Icon, {
395
+ }, isDefined4(timestamp) ? new Date(timestamp).toLocaleString() : "")), /* @__PURE__ */ React4.createElement(Icon, {
366
396
  sx: {
367
397
  justifySelf: "end"
368
398
  }
369
- }, hasResult ? /* @__PURE__ */ React3.createElement(CheckCircle, {
399
+ }, hasResult ? /* @__PURE__ */ React4.createElement(CheckCircle, {
370
400
  color: "success"
371
- }) : /* @__PURE__ */ React3.createElement(Warning, {
401
+ }) : /* @__PURE__ */ React4.createElement(Warning, {
372
402
  color: "warning"
373
403
  })));
374
404
  }, "BroadcastedRpcCallDetailsSummaryStack");
@@ -379,7 +409,7 @@ var BroadcastedRpcCallDetailsCard = /* @__PURE__ */ memo(({ rpcRequestResponsePa
379
409
  const [expanded, setExpanded] = useState5(false);
380
410
  if (!rpcRequestResponsePairs) return null;
381
411
  const { request, result, source } = rpcRequestResponsePairs;
382
- return /* @__PURE__ */ React4.createElement(Card, {
412
+ return /* @__PURE__ */ React5.createElement(Card, {
383
413
  sx: {
384
414
  p: 1,
385
415
  display: "flex",
@@ -388,42 +418,42 @@ var BroadcastedRpcCallDetailsCard = /* @__PURE__ */ memo(({ rpcRequestResponsePa
388
418
  ...sx
389
419
  },
390
420
  ...props
391
- }, /* @__PURE__ */ React4.createElement(BroadcastedRpcCallDetailsSummaryStack, {
421
+ }, /* @__PURE__ */ React5.createElement(BroadcastedRpcCallDetailsSummaryStack, {
392
422
  expanded,
393
423
  params: request.rpcCall.params,
394
424
  hasResult: isDefined5(result),
395
425
  method: request.rpcCall.method,
396
426
  setExpanded,
397
427
  timestamp: request.timestamp
398
- }), /* @__PURE__ */ React4.createElement(Collapse, {
428
+ }), /* @__PURE__ */ React5.createElement(Collapse, {
399
429
  in: expanded,
400
430
  mountOnEnter: true,
401
431
  unmountOnExit: true
402
- }, /* @__PURE__ */ React4.createElement(Stack2, {
432
+ }, /* @__PURE__ */ React5.createElement(Stack2, {
403
433
  direction: "column",
404
434
  p: 1,
405
435
  gap: 2,
406
436
  alignItems: "stretch"
407
- }, /* @__PURE__ */ React4.createElement(Typography2, {
437
+ }, /* @__PURE__ */ React5.createElement(Typography2, {
408
438
  variant: "body2"
409
- }, "Source:", /* @__PURE__ */ React4.createElement(Typography2, {
439
+ }, "Source:", /* @__PURE__ */ React5.createElement(Typography2, {
410
440
  variant: "caption",
411
441
  component: "span",
412
442
  fontFamily: "monospace",
413
443
  sx: {
414
444
  ml: 1
415
445
  }
416
- }, source)), /* @__PURE__ */ React4.createElement(Typography2, {
446
+ }, source)), /* @__PURE__ */ React5.createElement(Typography2, {
417
447
  variant: "body2"
418
- }, "Request:"), /* @__PURE__ */ React4.createElement(JsonViewerEx, {
448
+ }, "Request:"), /* @__PURE__ */ React5.createElement(JsonViewerEx, {
419
449
  value: request,
420
450
  sx: {
421
451
  maxHeight: 300,
422
452
  overflow: "auto"
423
453
  }
424
- }), isDefined5(result) ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(Typography2, {
454
+ }), isDefined5(result) ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(Typography2, {
425
455
  variant: "body2"
426
- }, "Result:"), /* @__PURE__ */ React4.createElement(JsonViewerEx, {
456
+ }, "Result:"), /* @__PURE__ */ React5.createElement(JsonViewerEx, {
427
457
  value: result,
428
458
  sx: {
429
459
  maxHeight: 300,
@@ -504,44 +534,44 @@ var usePaginatedEventPairs = /* @__PURE__ */ __name((formattedEvents, numberOfVi
504
534
  var BroadcastedRpcCallsDrawer = /* @__PURE__ */ __name(({ anchor = "right", onClearEvents, drawerTitle, events, onClose, numberOfVisibleEvents = 25, ...props }) => {
505
535
  const [scrollableDiv, setScrollableDiv] = useState7(null);
506
536
  const { allEventEntries, visibleEvents, totalPages, effectiveCurrentPage, handleClearEvents, handlePageChange } = usePaginatedEventPairs(events, numberOfVisibleEvents, onClearEvents, scrollableDiv);
507
- return /* @__PURE__ */ React5.createElement(Drawer, {
537
+ return /* @__PURE__ */ React6.createElement(Drawer, {
508
538
  anchor,
509
539
  onClose,
510
540
  keepMounted: false,
511
541
  ...props
512
- }, /* @__PURE__ */ React5.createElement(CloseDrawerIconButton, {
542
+ }, /* @__PURE__ */ React6.createElement(CloseDrawerIconButton, {
513
543
  anchor,
514
544
  onClose
515
- }), /* @__PURE__ */ React5.createElement(Stack3, {
545
+ }), /* @__PURE__ */ React6.createElement(Stack3, {
516
546
  gap: 2,
517
547
  sx: {
518
548
  p: 3
519
549
  },
520
550
  flexShrink: 0
521
- }, /* @__PURE__ */ React5.createElement(Stack3, {
551
+ }, /* @__PURE__ */ React6.createElement(Stack3, {
522
552
  direction: "row",
523
553
  justifyContent: "space-between",
524
554
  alignItems: "center",
525
555
  gap: 4
526
- }, /* @__PURE__ */ React5.createElement(Typography3, {
556
+ }, /* @__PURE__ */ React6.createElement(Typography3, {
527
557
  variant: "h6"
528
- }, drawerTitle ?? "Broadcasted RPC Calls"), /* @__PURE__ */ React5.createElement(Button, {
558
+ }, drawerTitle ?? "Broadcasted RPC Calls"), /* @__PURE__ */ React6.createElement(Button, {
529
559
  variant: "outlined",
530
560
  size: "small",
531
561
  onClick: handleClearEvents
532
- }, "Clear All")), allEventEntries.length > 0 && /* @__PURE__ */ React5.createElement(Pagination, {
562
+ }, "Clear All")), allEventEntries.length > 0 && /* @__PURE__ */ React6.createElement(Pagination, {
533
563
  count: totalPages,
534
564
  page: effectiveCurrentPage,
535
565
  onChange: handlePageChange,
536
566
  color: "primary"
537
- })), /* @__PURE__ */ React5.createElement(Stack3, {
567
+ })), /* @__PURE__ */ React6.createElement(Stack3, {
538
568
  direction: "column",
539
569
  id: "events-container",
540
570
  flexGrow: 1,
541
571
  sx: {
542
572
  overflowY: "hidden"
543
573
  }
544
- }, /* @__PURE__ */ React5.createElement(Box, {
574
+ }, /* @__PURE__ */ React6.createElement(Box, {
545
575
  ref: /* @__PURE__ */ __name((el) => setScrollableDiv(el), "ref"),
546
576
  sx: {
547
577
  overflowY: "auto",
@@ -549,7 +579,7 @@ var BroadcastedRpcCallsDrawer = /* @__PURE__ */ __name(({ anchor = "right", onCl
549
579
  pb: 3
550
580
  }
551
581
  }, visibleEvents.map(([id, broadcastedRpcCall], index) => {
552
- return /* @__PURE__ */ React5.createElement(BroadcastedRpcCallDetailsCard, {
582
+ return /* @__PURE__ */ React6.createElement(BroadcastedRpcCallDetailsCard, {
553
583
  key: id,
554
584
  rpcRequestResponsePairs: broadcastedRpcCall,
555
585
  sx: {
@@ -560,7 +590,7 @@ var BroadcastedRpcCallsDrawer = /* @__PURE__ */ __name(({ anchor = "right", onCl
560
590
  }, "BroadcastedRpcCallsDrawer");
561
591
  var BroadcastedRpcCallsDrawerWithEvents = /* @__PURE__ */ __name((props) => {
562
592
  const { clearEvents, events } = useRpcBroadcastListener();
563
- return /* @__PURE__ */ React5.createElement(BroadcastedRpcCallsDrawer, {
593
+ return /* @__PURE__ */ React6.createElement(BroadcastedRpcCallsDrawer, {
564
594
  events,
565
595
  onClearEvents: clearEvents,
566
596
  ...props
@@ -569,12 +599,12 @@ var BroadcastedRpcCallsDrawerWithEvents = /* @__PURE__ */ __name((props) => {
569
599
 
570
600
  // src/components/menu/Avatar.tsx
571
601
  import { Avatar as Avatar2 } from "@mui/material";
572
- import React7 from "react";
602
+ import React8 from "react";
573
603
 
574
604
  // src/components/menu/Icon.tsx
575
- import React6 from "react";
605
+ import React7 from "react";
576
606
  var NetworkIcon = /* @__PURE__ */ __name(({ icon, style, ...props }) => {
577
- return /* @__PURE__ */ React6.createElement("span", {
607
+ return /* @__PURE__ */ React7.createElement("span", {
578
608
  // eslint-disable-next-line react-dom/no-dangerously-set-innerhtml
579
609
  dangerouslySetInnerHTML: {
580
610
  __html: icon ?? ""
@@ -591,14 +621,14 @@ var NetworkIcon = /* @__PURE__ */ __name(({ icon, style, ...props }) => {
591
621
 
592
622
  // src/components/menu/Avatar.tsx
593
623
  var NetworkAvatar = /* @__PURE__ */ __name(({ icon, iconStyles, name, sx, ...props }) => {
594
- return /* @__PURE__ */ React7.createElement(Avatar2, {
624
+ return /* @__PURE__ */ React8.createElement(Avatar2, {
595
625
  sx: {
596
626
  backgroundColor: "white",
597
627
  ...sx
598
628
  },
599
629
  alt: name,
600
630
  ...props
601
- }, /* @__PURE__ */ React7.createElement(NetworkIcon, {
631
+ }, /* @__PURE__ */ React8.createElement(NetworkIcon, {
602
632
  icon,
603
633
  style: {
604
634
  ...iconStyles
@@ -607,7 +637,7 @@ var NetworkAvatar = /* @__PURE__ */ __name(({ icon, iconStyles, name, sx, ...pro
607
637
  }, "NetworkAvatar");
608
638
  var ActiveNetworkAvatar = /* @__PURE__ */ __name((props) => {
609
639
  const { activeNetwork } = useChainNetwork();
610
- return /* @__PURE__ */ React7.createElement(NetworkAvatar, {
640
+ return /* @__PURE__ */ React8.createElement(NetworkAvatar, {
611
641
  icon: activeNetwork?.icon,
612
642
  name: activeNetwork?.name,
613
643
  ...props
@@ -617,14 +647,14 @@ var ActiveNetworkAvatar = /* @__PURE__ */ __name((props) => {
617
647
  // src/components/menu/MenuItem.tsx
618
648
  import { ListItemText } from "@mui/material";
619
649
  import { ActiveMenuItem } from "@xyo-network/react-chain-shared";
620
- import React8 from "react";
650
+ import React9 from "react";
621
651
  var NetworkMenuItem = /* @__PURE__ */ __name(({ active, network, onClick, updateActiveNetwork, ...props }) => {
622
652
  const handleClick = /* @__PURE__ */ __name((event) => {
623
653
  if (network === void 0) throw new Error("Network is undefined");
624
654
  updateActiveNetwork?.(network.id);
625
655
  onClick?.(event);
626
656
  }, "handleClick");
627
- return /* @__PURE__ */ React8.createElement(ActiveMenuItem, {
657
+ return /* @__PURE__ */ React9.createElement(ActiveMenuItem, {
628
658
  title: network?.name,
629
659
  disableRipple: true,
630
660
  onClick: handleClick,
@@ -633,38 +663,38 @@ var NetworkMenuItem = /* @__PURE__ */ __name(({ active, network, onClick, update
633
663
  py: 1
634
664
  },
635
665
  ...props
636
- }, /* @__PURE__ */ React8.createElement(NetworkAvatar, {
666
+ }, /* @__PURE__ */ React9.createElement(NetworkAvatar, {
637
667
  icon: network?.icon,
638
668
  name: network?.name,
639
669
  sx: {
640
670
  width: 30,
641
671
  height: 30
642
672
  }
643
- }), /* @__PURE__ */ React8.createElement(ListItemText, null, network?.name));
673
+ }), /* @__PURE__ */ React9.createElement(ListItemText, null, network?.name));
644
674
  }, "NetworkMenuItem");
645
675
 
646
676
  // src/components/status/Alert.tsx
647
677
  import { Alert, AlertTitle, Button as Button3 } from "@mui/material";
648
- import React10, { useMemo as useMemo3, useState as useState8 } from "react";
678
+ import React11, { useMemo as useMemo3, useState as useState8 } from "react";
649
679
 
650
680
  // src/components/status/Dialog.tsx
651
681
  import { Button as Button2, Dialog, DialogActions, DialogContent, DialogTitle, List, ListItem, Typography as Typography4 } from "@mui/material";
652
- import React9 from "react";
682
+ import React10 from "react";
653
683
  var NetworkStatusDialog = /* @__PURE__ */ __name(({ updates, ...props }) => {
654
- 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, {
684
+ 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, {
655
685
  key: start + update,
656
686
  sx: {
657
687
  flexDirection: "column",
658
688
  alignItems: "start",
659
689
  pl: 0
660
690
  }
661
- }, /* @__PURE__ */ React9.createElement(Typography4, null, update), /* @__PURE__ */ React9.createElement(Typography4, {
691
+ }, /* @__PURE__ */ React10.createElement(Typography4, null, update), /* @__PURE__ */ React10.createElement(Typography4, {
662
692
  gutterBottom: true,
663
693
  sx: {
664
694
  opacity: 0.75,
665
695
  fontSize: ".8333rem"
666
696
  }
667
- }, "Start:", " ", new Date(start).toLocaleString(), " ", /* @__PURE__ */ React9.createElement("br", null), "End:", " ", new Date(end).toLocaleString()))))), /* @__PURE__ */ React9.createElement(DialogActions, null, /* @__PURE__ */ React9.createElement(Button2, {
697
+ }, "Start:", " ", new Date(start).toLocaleString(), " ", /* @__PURE__ */ React10.createElement("br", null), "End:", " ", new Date(end).toLocaleString()))))), /* @__PURE__ */ React10.createElement(DialogActions, null, /* @__PURE__ */ React10.createElement(Button2, {
668
698
  onClick: /* @__PURE__ */ __name((e) => props.onClose?.(e, "backdropClick"), "onClick"),
669
699
  color: "primary",
670
700
  variant: "outlined"
@@ -694,15 +724,15 @@ var NetworkStatusAlert = /* @__PURE__ */ __name(({ status, ...props }) => {
694
724
  }, [
695
725
  status
696
726
  ]);
697
- return /* @__PURE__ */ React10.createElement(Alert, {
727
+ return /* @__PURE__ */ React11.createElement(Alert, {
698
728
  severity,
699
729
  ...props
700
- }, /* @__PURE__ */ React10.createElement(AlertTitle, null, status?.description), status?.updates && status.updates.length > 0 ? /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement(Button3, {
730
+ }, /* @__PURE__ */ React11.createElement(AlertTitle, null, status?.description), status?.updates && status.updates.length > 0 ? /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(Button3, {
701
731
  color: severity,
702
732
  variant: "outlined",
703
733
  size: "small",
704
734
  onClick: /* @__PURE__ */ __name(() => setOpen(true), "onClick")
705
- }, "Updates"), /* @__PURE__ */ React10.createElement(NetworkStatusDialog, {
735
+ }, "Updates"), /* @__PURE__ */ React11.createElement(NetworkStatusDialog, {
706
736
  open,
707
737
  onClose: handleClose,
708
738
  updates: status.updates
@@ -710,7 +740,7 @@ var NetworkStatusAlert = /* @__PURE__ */ __name(({ status, ...props }) => {
710
740
  }, "NetworkStatusAlert");
711
741
 
712
742
  // src/components/status/NetworkStatus.tsx
713
- import React11 from "react";
743
+ import React12 from "react";
714
744
  var validNetworkStates = /* @__PURE__ */ new Set([
715
745
  "online",
716
746
  "unknown"
@@ -718,7 +748,7 @@ var validNetworkStates = /* @__PURE__ */ new Set([
718
748
  var NetworkStatus = /* @__PURE__ */ __name(({ children, ...props }) => {
719
749
  const [networkStatus] = usePollNetworkStatus();
720
750
  const showStatus = networkStatus && !validNetworkStates.has(networkStatus.state);
721
- return /* @__PURE__ */ React11.createElement(React11.Fragment, null, showStatus ? /* @__PURE__ */ React11.createElement(NetworkStatusAlert, {
751
+ return /* @__PURE__ */ React12.createElement(React12.Fragment, null, showStatus ? /* @__PURE__ */ React12.createElement(NetworkStatusAlert, {
722
752
  status: networkStatus,
723
753
  ...props
724
754
  }) : null, children);
@@ -732,6 +762,7 @@ var defaultBroadcastConfig = {
732
762
  response: true
733
763
  };
734
764
  export {
765
+ ActiveGatewayProvider,
735
766
  ActiveNetworkAvatar,
736
767
  BroadcastRpcRequestEventName,
737
768
  BroadcastRpcResponseEventName,
@@ -756,6 +787,7 @@ export {
756
787
  usePollNetworkStatus,
757
788
  useRpcBroadcastListener,
758
789
  useViewerInPage,
790
+ useViewerInPageV2,
759
791
  useViewerInWallet
760
792
  };
761
793
  //# sourceMappingURL=index.mjs.map